Designing a website is a daunting challenge. We design at a subconscious level, based on many years of experience. If you are not used to thinking about design at a conscious level, then you will probablystruggle to begin. The first thing to do is to look at the various components that make up the product.
Understanding Today’s Website Design Challenges. These are usually:
Consider your approach to each of these elements:
What particular grid structure on the website do you want? Can you explain your reasons for using a 12-column grid and not a 16-column one? How about the margins and padding? If a client complained that there was too much white space between columns, what would you say?
Another issue is when you purposely break out of a grid. Did you do that intentionally or was it just an impulsive decision? Did you decide on a particular grid because it felt right for the website or just because you had fallen into a habit? You need to be able to justify your approach to our clients and
Layout and grid might sound like the same thing, but they’re not. Layout is the white space and the placement of each element on a page. These can be points of conflict between the designer and the client, so be able to explain your approach.
As an example, how do you justify all of the white space that Google uses on its home page? And why did you leave so much white space on yours? Was it that you wanted to draw the user’s eye to a particular element, or because you wanted to improve readability?
What about the positioning of each element? Why is the search box where you put it? There are many questions you need to ask here about your layout.
Color is perhaps the most controversial subject, so we need to understand our motivation. This can be approached in one of four ways:
- Corporate branding guidelines
- The palette has been defined by the guidelines, and you must work within these constraints.
- Tools such as Adobe’s Kuler produce a palette based on established theory.
- Emotional response
- Lots of research has been done on people’s responses to palette colors.
- Main image
If your site has a dominant image that has already been approved by the client, use it as the basis for the color palette. There are some great tools for extracting color palettes from images.
Kuler is just one of many tools that help you apply color theory to your palette. Your choices will prevent color from becoming a matter of personal preference and avoid conflict.
Something as seemingly simple as typography consists of a lot of different decisions. Those decisions extend far beyond your selection of typeface and encompass line height, size, weight, some kerning and much more.
To many clients, imagery is just about subject matter. But it is really about much more. Imagery is based on the mood it sets, the colors it contains, and even things such as the eye line of the person in the photo. Articulate these decisions so others can recognize that you can’t easily substitute one image for another without affecting the design.
Styling refers to screen elements that are not directly content-related, such as buttons, links, call-out boxes and all the other elements that need to be decided on. How you decide to style these elements will dramatically shape the feel of the website.
Whenever justifying a design, always refer to the material that’s already been agreed on. Reference material can be taken from many areas including ignoring the fold by referring to other researchers, such as ClickTale. Citing research and experts is a great way for you to justify an approach. Remember, being able to explain your design is only half of the objective. The other half is about improving the quality of your work.
Improving Your Work
Justifying your decisions will always improve the quality of your designs. Instead of leaving it to the subconscious, consider imagery, layout, typography and other ideas. By discussing your process, you refine it and it makes you more efficient as a designer.
Write a blog post about one of your designs. Justify your approach, and then encourage others to provide feedback on your design. And finally, don’t forget to make comments and ask questions of others who have posted their own work.
When we design a website, it’s always a struggle. Doing it right and following these ideas is the KEY to building a successful site, both for you and your client. When you do your best work, you will always reap the rewards.
Stephen John, working as a blogger at Key Difference. Area of expertise is on Web Design, Social Media and SEO.