Posts Tagged ‘Designing’

Concept Feedback: Get Your Designs Reviewed By Esigners

July 14th, 2009 No comments


If you are working alone, chances are that you have a hard time to get a honest feedback from other professionals. Concept Feedback is here for that, it’s a social network for designers that allows you to upload some design you are working on to get a feedback from other designers. They can vote on the design and leave a review of the design, then other members can rate these reviews and discuss them.

The website is quite straightforward and useful, and so far it seems that people using it are designers, so why don’t you give it a try?

Instant iPhone Compatible Websites: iWebKit

July 3rd, 2009 No comments

iWebKit is an open source toolkit for creating iPhone / iPod compatible websites very easily & quickly.

It is simplicity lies under the usage of basic html that anyone can edit rather than more complicated Ajaxed solutions.


The toolkit has support for:

  • iPhone-style form elements (like on/off checkboxes)
  • pop-ups
  • fullscreen
  • & more..
  • It is possible to theme the interface besides the standard iPhone theme & the download package comes with various ready-to-use themes.

And, websites created with iWebKit are compatible with the latest iPhone OS 3.0.

Is Google Chrome The New IE 6 For Web Designers?

March 19th, 2009 No comments

Just when you thought you were done with IE 6 and its hacks and exceptions, now you’ve got a new browser to consider: Google’s Chrome.

The good news is that Chrome is a lot more compatible with web standards than IE 5 and 6. However, Chrome has its own idiosyncrasies and bugs.

No one knows if Chrome is here to stay, but it has already captured a surprisingly decent share of the web browser market in a short period of time.

Here are some tips to get your web pages working in Chrome and hopefully looking the way they were designed to look.

Mac Users

As of February 2009, Chrome is still a browser for Microsoft Windows PCs. If you use a Mac, you will need to run Microsoft Windows through Bootcamp, or one of the virtualization products for the Mac (Sun’s VirtualBox, Parallels, VMWare Fusion). If you are really daring, you can try and get Chrome to run using Darwine. Google promises to have a native Mac version of Chrome available in the coming months.

Vanishing Pop-Ups

Pop-Up blocking is great unless your website really needs pop-up functionality. If you have a web page that must use pop-ups, you won’t see them in Chrome. By design, Chrome only displays the title of a pop-up and minimizes it to the bottom right corner of the browser window. Users will need to click and drag the pop-up’s title in order to view its content.

SSL is Broken?

By design, Chrome will only certify a valid SSL (secure sockets layer) page with the padlock icon if all the elements on the page are served via SSL. In other words, if your page is served via SSL but it calls elements via non-secured HTTP, Chrome will give your page an exclamation point icon indicating that it considers your page to be an inconsistent SSL transmission. To get around this, make sure that all the resources loaded by your web page, including all images, are prefaced with HTTPS.

Declare Encoding First

If your web page text is garbled or otherwise just plain wrong in Chrome, you may need to insert encoding information into the <head> section of each web page. If you already have encoding information, it must come first, before any CSS or Javascript. Otherwise, Chrome will just ignore it. A working example:

<meta http-equiv=”Content-Type” content=”text/html; charset=windows-1251?>
<script type=”text/javascript”>
… your JavaScript code …
… your CSS code …
Also, Chrome will ignore encoding specified by Javascript. Period. For example, the following would be ignored:

document.write(”<meta http-equiv=”Content-Type” content=”text/html; charset=windows-1251?>”);
Instead of using JavaScript, you must insert your encoding into the beginning of the <head> section of each web page as shown above.

Bookmark Favorites

When users choose to bookmark your web site, you can control the default bookmark name, description, link, and bookmark icon. Just make sure to place your code in the <head> section of your web pages. Here is a working example:

<meta name=”application-name” content=”Greatest Website”/>
<meta name=”description” content=”The very best on the web”/>
<meta name=”application-url” content=””/>
<link rel=”icon” href=”great-icon_32×32.png” sizes=”32×32?/>
<link rel=”icon” href=”great-icon_48×48.png” sizes=”48×48?/>

Fixing JavaScript

If your JavaScript is not working properly in Chrome, check Chrome’s JavaScript console, accessible from the Page menu icon -> Developer -> JavaScript console. That should give you some direction as to what you can change.

For the more advanced JavaScript developers, you can also use the JavaScript Debugger, accessible from the Page menu icon -> Developer -> Debug JavaScript. That will allow you to watch variables and set breakpoints.


CSS Image Problems

If you are using images or backgrounds implemented through CSS and they are not rendering properly in Chrome, you might want to convert images between GIF, JPG, and PNG to see if a different image format solves your problems. Although this makes no sense, it sometimes works, especially with random spacing and image formatting problems.

CSS “First” Selector Hack

Chrome can be finicky and unforgiving about CSS and may ignore styles applied to certain page elements. You might try using the “first-of-type” keyword which will be ignored by all other browsers (except for Apple’s Safari). For example, if you cannot get a particular style applied to the <body> section of your web page to work in Chrome, add in something like the following:

body:first-of-type p {color:#ff0000;}

“First-of-type” will simply be ignored by the browsers that are already displaying your page the way you intended.

GiantIsland CSS Hack

Chrome interprets cascading style sheets (CSS) differently than other browsers. Then again, IE 5, 6, and 7 do not even interpret CSS the same! The GiantIsland CSS Hack is a relatively simple CSS markup hack that makes use of square brackets [ ] to target CSS on specific browsers like Chrome. As a bonus, it can also help you conform your CSS to IE 5, 6, 7, Safari, and Firefox, all at the same time. For more details, check it out at

Stay Away from HTML5

Chrome does not try to conform to HTML5 API standards yet, even though Webkit, its rendering engine, does support HTML5. If you use HTML5 features or syntax, you will likely run into problems. Stick with HTML4 standards and you should have an easier time. Chrome will likely support HTML5 in the near future.

Validate Your Pages

Before swearing at Chrome and throwing in the towel, validate your pages to make sure you have not inadvertently used a non-standard HTML call. You can validate any web page at Some web browsers allow you to take some shortcuts with web standards, but Chrome is not very lenient.

Try it with Safari

If you can’t get your web pages to look right under Chrome no matter what you try, try your web pages in Safari before giving up. Safari is Apple’s web browser and is available for both Mac and Windows PCs. If you use Windows, you can freely download Safari from Apple at Both Chrome and Safari are built using the open source “Webkit” browser rendering engine. If you can see a rendering error in both Chrome and Safari, there is a good chance that Webkit is the culprit. You can post a bug for the Webkit developers at

Aw Snap!

The Chrome developers have provided some funny error messages (if an error can be considered funny). If Chrome gives you the dark grey “Aw Snap!” page which also says “Something went wrong while displaying this webpage,” it might not be your web page at all. Chrome has a tendency to crash on some PCs depending on system settings and other installed applications. Try a few other well-known web pages, and see if they crash. Also try closing Chrome, re-launching it, and then test your web pages again. Some people have found Chrome to be unstable on some PCs. Google intends for Chrome to become more sturdy with each new version.

Bug Reporting

If you find a bug with Chrome’s rendering, report it! You will be making the world a better place. Google maintains a public bug list for Chrome at

Written exclusively for WDD by Derek Underwood, a professional web designer and software developer. You can read more about Derek and contact him at his website:

14 Jan 6 Reasons Why Designers Should Code

March 18th, 2009 No comments

I know, I know…none of us creative types want anything to do with coding past the very basic HTML/CSS we need to know to get our designs to the developers.

Doing development is something for those programming grunts, those code jockeys, those geeks.

Why should we enter the trenches of development when it’s so nice up here with the Photoshop brushes, afternoon tea, and MacPros? Because you’ll be a better designer for it.

Skeptical? Read on and discover 6 reasons why designers should code…

1. Better XHTML

I’ve worked with and known many designers who knew only the bare minimum needed to get their designs out of Photoshop and into a web format. Oftentimes they would make use of a software program or plugin like SiteGrinder. While these programs keep getting better and better at making compliant code, they still don’t match the human-produced variety.

Knowing how to write your own standards-compliant XHTML will make you a valuable addition to any web team (emphasis on the standards-compliant part). With all the fuss about PHP, ASP.NET, Ruby, and many other languages, people tend to forget that everything ends up being HTML in the end, because that’s what your browser has to have in order to render a page. The more you know about the medium you work in, the better you work in that medium.

2. Better SEO

And while we’re talking about standards-compliant code, we should mention SEO. This is a big buzzword, though not quite as much as it has been in the past. However, what this means is that SEO is becoming a much more commonplace idea of what a website should strive for, instead of just an added special feature for big business sites.

If you can learn to write your own code, you’re much closer to being able to list “SEO Compliant Designs” on your sheet of available services. That means you can charge more, and it’s another badge on your hat.

3. Better Accessibility

Better code and better SEO = better accessibility. Part of of the job of any designer is to present information in a clear and coherent manner, and on the web that means not solely in a visual manner. A shoddily-coded website can be a nightmare to navigate if you’re blind, or even if you’re using a mobile device.

Learning the ins and outs of developing code for accessibility not only allows you have that knowledge as part of your production skillset, but it will also help you to better understand the considerations you should take when designing for accessibility.

Accessibility is a mandate for all government websites, nearly all education sites, and businesses are starting to see the value in it as well. The more people you can reach via your site, the more chance you have of accomplishing your goal, whatever it may be. And that has to be reflected in any successful design.

4. Better Left Side

Being a right-brained creative is great, but giving your left side a workout can spur on creativity of a different nature. The motto at the bottom of the WordPress website is “Code Is Poetry”, and this is because translating a written language to something that can be visually seen is truly an art form.

Learning to write your own code opens up whole new avenues of expression. Developing your technical and analytical abilities can improve your information design, developing wireframes, and create a pathway to work with interaction design. And who knows, it may even improve your math skills!

5. Better Communication

It’s easy to get lost in the techno-jargon used by developers, simply because you may not have been exposed to the type of things they are discussing. Digging in and working with code yourself will allow you to become familiar with the terminology that is used when conversing about the construction of a site.

Being able to speak the lingo will help when you need to communicate with a developer or project manager about how a design should be implemented.

6. Better Design

You can only do so much knowing the fundamentals of design. Typography, color theory, composition, etc. are all fantastic and extremely important skills to know (and know well)…but eventually if you want to excel in your creativity, you must learn the tools of the trade. Painters learn about canvas types, paint compositions, and bristle qualities. Web design is no exception. Learn to code: you’ll be better for it.

Written exclusively for WDD by Ryan Burrell.

How NOT To Design A Logo

March 18th, 2009 No comments

Logo design in today’s world is totally under rated.

People do not understand how important a good logo is and how valuable it is to their business.

In this article I am going to outline the ways in which you should NOT go about getting your logo designed… that is, if you are truly serious about business.

What is A Logo?

To understand what a logo is meant to do, we first must know what a logo is. A logo’s design is for immediate recognition, inspiring trust, admiration, loyalty and an implied superiority. The logo is one aspect of a company’s commercial brand, or economic entity, and its shapes, colours, fonts, and images usually are different from others in a similar market. Logos are also used to identify organizations and other non-commercial entities.

It makes me wonder why people have no logo or why they would even bother with a cheap logo design if a logo is meant to do all of these things?

Logo Design Contests


The worst deal you could probably go for is a logo design contest. Logo design contests are where you give a brief and then you have multiple designers come back to you with their designs. Although this sounds like a mighty good deal, the quality is usually far from anything you would want to represent your business.

You will be wasting your money and in the long term, in terms of damage done to your business, that amount could be quite considerable.

On another note, design contests & designers who design on a speculative basis are damaging the design industry as designers should not have to invest time and resources with no guarantee of payment.

If you want further proof, read these articles: Logo Design Contests Are Bad For Business or The Reality of Logo Design Contests.

Too Good To Be True Deals


If you do a search on ‘logo design’ on google you will find many businesses offering logo designs for very cheap and unbelievable prices. Such deals as “5 design concepts from 5 designers!” or “6 logos from 5 designers only $200? – Stay away!

These deals are extremely deceiving and the quality is far from satisfactory. Have you ever wondered how much thought they actually put into your logo design? Professional logo designers have a strict logo design process that can take weeks or in some cases months to complete a logo. They may offer you a result within 24 hours or maybe even less meaning literally no thought was put into your logo design.

Stock Imagery


Some so called “designers” (usually the same people who enter design contests) steal images from stock sites to design your logo… or in some cases business owners download and use the stock images themselves. This is a huge no-no. Did you know that stock imagery gets downloaded by thousands of people? This should be reason enough not to use stock imagery as your logo.

If you do this, other people will have access to your logo design and can and will use it in places that will potentially devalue your business. Ensure your logo design is original.

Do It Yourself Logo Design


Closely linked to the stock imagery scenario above, business owners or those wanting a logo will try to do it themselves. I highly recommend against this and suggest you leave the design to a professional, much as you would leave your dental work to a dentist.

Free Logo Makers


You will find many free online logo makers on the web. Not only do these logos look unprofessional, hundreds of other people could have the same logo as you and what is the point of that? These logos have no thought, concept or memorability about them, they are merely symbols.

They say nothing about your business and do nothing that a logo is supposed to do… I repeat, stay away from free logo makers.

Getting A Design Without Feedback


Before approving and implementing a design, ensure you get feedback from your clients, peers, and stakeholders. Getting feedback on a design is a crucial part of the logo design process as it ensures that your logo is going to be successful.

Take these poor phallic logo designs above. I wonder if they realized their logos had such hidden meaning? Ensure you don’t turn out like this by getting a professionally designed logo.

What is the cost of a professional logo design?

The cost of a professional logo design is a question that cannot be easily answered as every company has different needs, however, the best way to approach this problem is to draw up a customized quote for each individual.

A number of factors have to be taken into consideration when designing a logo, such as how many logo concepts need to be presented, how many revisions are required, how much research is needed, the size of the business and so on.

To wrap up, I’d like to quote a comparison by David Airey: Comparing the design industry to any other is by no means exact, but the, “How much for a logo?” question is kind of like asking an estate agent, “How much for a house?”.

Disclaimer: This article was written exclusively for WDD by Jacob Cass and reflects his personal opinion on logo design. It does not necessarily reflect WDD’s opinion on the subject. Jacob is a professional logo designer who runs the popular blog Just Creative Design

Categories: Designing, Website Design Tags: ,

Designing Outside Your Comfort Zone

March 18th, 2009 No comments

When you’ve been designing for a few years, it’s easy to fall into patterns. You carve out your personal style and find your inner voice. You figure out what you’re good at, and the world encourages you to play to those strengths.

Bosses, clients and peers want to see you do what you’ve always done because they know they like it. There are no unpleasant surprises. Sticking to your strengths is an easy formula for success, but only in the short-term. If you don’t adapt and grow as a designer, you’ll end up like that poor guy wearing the Members Only jacket without a hint of irony. Sure, it was uber-cool once. But styles change, and so should you.

In your personal comfort zone you feel confident. You know you can perform well there. But if you find your design work to be comfortable and easy, it means you’re not growing. Remember the pre-project jitters you used to get as a young designer? The overwhelming excitement of all the possibilities and challenges in front of you? If you haven’t felt that way in a while, you’re asleep at the wheel. It’s time to push yourself outside the zone!

Expand Your Design Arsenal

The great Milton Glaser said “To design is to communicate clearly by whatever means you can control or master.” Which means it always make sense to acquire a few more communication techniques in your personal design arsenal. Here’s how you can push yourself outside your comfort zone:

1. Identify the boundaries of your personal comfort zone


So much of what we do during our design process is unconscious. If you don’t stop to examine yourself every now and then its easy to fall into a rut. You might use the same typeface in nearly every comp without even thinking about it, for instance. Or you might automatically put a gradient on your buttons, or always use white backgrounds, or put beautifully detailed illustrations on every homepage you design. Whatever your habits are, it is important to make yourself aware them.

Look at your portfolio and try to see the big picture. Make a list of all the things that make up “your style”. While you’re doing this, take an honest look at your strengths and weaknesses. We all have areas we need to improve in. Admitting you’re lousy at something is the first step toward getting better at it. If you feel like you can’t make an honest assessment of your own work, ask a designer friend to be brutally honest or go to an online design forum and request a critique. While the truth can be hard to hear, it will definitely motivate you.

2. Set Specific, Attainable Goals


Those things you’re already good at? They represent past successes. They worked for you once, so you know they’ll work again. But why let your skills stagnate? Other things can work too… perhaps even better. Think about the designs that inspire you daily. Are there certain styles you admire but feel you can’t recreate? If so, make a pact with yourself:

Pick a design technique (or two or three) that you would like to explore. The key to becoming a more well-rounded and flexible designer is a willingness to new things. You need to embrace risk every now and then to push your own creative boundaries. That said, its important to pick your moment. Everyone knows its hard to risk failure when you are getting paid to be good. There is a time and a place for exploring new design directions. If a client has hired you specifically because you’re great at typography, they don’t want to see you test out an illustrative concept. But opportunities to stretch your creativity come by all the time. You just have to make them work for you.

Don’t aim to become a radically different designer than you are now. Build on what you’re good at – don’t throw it away and start over. Aim to be yourself only braver and more well-rounded. Work on being the designer you always wanted to be put felt you couldn’t possibly pull off. Make a list of specific, attainable goals you would like to achieve in the next three months. Mine might say

1) Create a typography-heavy site design

2) Create a conceptual illustration for use on a homepage

3) Work with a dark background color

Post your list where you will see it every day. The next time a new project comes in, look at your list and see if this project can help you to meet one of your goals.

3. Get Passionate About Change


Now that you know what areas you want to improve, it’s time to inspire yourself. If you really want to change and grow you have to get passionate and excited about your new goals. Feed your brain with inspiration from as many places as possible. Soak up ideas. Whatever you do, don’t stick to the web galleries or the same old blogs you’ve been reading for years. Find new sources and explore new avenues. Look more closely at your peers at work, or rock stars within the design community. Examine at their growth as designers and take cues from them.

A quick flip through a few portfolios can be incredibly enlightening. The designers you think are top-notch probably weren’t always so amazing. If you dig back a few years, you will be able to see their progression. They had to stretch too. Pick a few role models to remind yourself what all the hard work is about.

When you’re trying to move outside your comfort zone as a designer, it’s important to do it in other areas of your life as well. Try listening to music you wouldn’t normally listen to. Take your laptop somewhere unfamiliar. Walk to work a different way each morning. Get out of your routine and wake your mind up so it starts to look forward to something new and different.

4. Dive In and Do Something Differently


All that time you spent assessing and inspiring yourself won’t go to waste. A project is going to come along that fits perfectly with one of your goals. And when it does, you’ll be more than ready to try out some new techniques.

To really maximize your learning, start big instead of just dabbling. Don’t be afraid to dive headfirst into the style you’re trying to learn. Chances are your first attempts won’t be completely successful, but you can always reign it back in later on. Now is the time to forget about failure and give yourself a free pass.

Even if you throw away everything you do at the beginning, working through the process will teach you things and help you feel more comfortable with your newly adopted techniques. The final design will probably only reflect a slight shift in your personal style, and that’s ok. In fact, that’s GOOD. You want to evolve your old style, not destroy it.

Starting big lets you play and learn, which lets you grow. Then you can take those too-big concepts and boil them down to something worthwhile. The end result? You’ll learn a new way to communicate through design. And you’ll find out that even if you’re not as talented as you’d like to be, you aren’t as horrible as you imagined either.