It Pays to Pay Attention to Design
Is it just me, or is web design a major pain in the posterior? Don’t get me wrong; I love web design to death. I’m self-taught; however. I’ve been fooling around with different versions of Dreamweaver for some ten years now, and I’ve come to a conclusion that…well, we’ve already determined what that is: Web design, although rewarding in the end, can be a major source of pain and frustration–especially if you go about it all wrong!
In my effort to help, I have devised a simple facts sheet below–a little something you can print out and keep nearby when terror strikes!
First, allow me just to say, as technically challenging as web design can be, please, please, please do NOT forget the importance of visual aspects. There’s a saying in the culinary world (not that it has anything to do with web design, but bare with me), “You eat with your eyes, first,” which means, your eyes take stuff in way before any of your other senses kick in.
The same holds true for websites: the more aesthetically pleasing a site, the greater the chances your visitors will stay for longer periods of time, and better yet, come back for more. Must love those repeat visitors!
And it doesn’t even matter WHAT you’re presenting as long as it looks good. Well, at first anyway. But, there has to be that first–as in impressions–the first ones matter the most. They set the foundation, so to speak.
People tend to gravitate toward visually appealing websites mainly because, in my humble opinion, they’re more trusting of the webmaster. It’s almost as if they think a competent web designer is all-around skilled and knowledgeable of his website’s topic. It’s Psych 101 all over again. So, let that be a lesson to you: it pays to pay attention to the design element of your site.
Basic Design Principles
When you’re creating your web page(s), you need to think like a designer: visually. To attract viewer attention and hold it (it’s all about attention span!), you must design your website with a good balance of text to graphics, and good web designers follow these design principles:
- Design your web page’s interface to fit inside the first 800 x 600 pixels so that the relevant content is easily visible when the page first loads. Why? Because people crave instant gratification! They want to see what your site’s about the moment your page loads, and most importantly, they’re too lazy to scroll horizontally! (It’s enough they have to scroll vertically!)
- Balance your web page’s layout by implementing no more than three focal points: a good rule of thumb is to use the “big, medium, small” strategy. “Big” is the big element(s) on the page, like images; “medium” is the medium element(s) on the page, for instance, a body of text; and finally, “small” is the small element(s) such as the top navigation bar, or menu bar.
- Depending greatly on the font itself, try to avoid using font small than 10 points. A good rule of thumb here is using fonts that the general mass of computers has, such as Arial, sans-serif, Times New Roman, and Verdana, among various others.
Basic Design Tips for Graphics
When you’re creating your website, don’t overlook the graphics because they play a ginormous part of web design! You seriously need to get educated on the standards and formats for different types of web graphics before plugging any old images into your page(s)! Using the wrong types of web graphics can mean the difference between a website that gets noticed and one that visitors surpass.
Follow these simple pointers to make sure your visual elements are pleasing to the eye:
- Make sure all your web graphics (images) are optimally saved for the internet.
- Be sure to save images that have a mix of text, flat-colored graphics, and photos as adaptive palette GIF files.
- If you have purely photographic images (i.e., ones without any text whatsoever), be sure to save them in JPEG (JPG) file format.
- Remember always to display anti-aliased graphics in the right background color; otherwise, you see a weird halo around them.
Web Design Tips for Presenting Information
Even if all you’re presenting is pure information, think visually while you’re building your website. Showing your information logically and taking strides to make it visually appealing is the basis of good web page design.
Below are a few tips and tricks that will help keep your visitors’ eyes from wandering. This is where those strong organizational skills you’ve been boasting about on your resume come into play!
- Organize and group navigation into primary, secondary, and tertiary sets, each containing no more than five to seven items.
- Outline your site’s categories and create no more than three levels, or channels, if you will: Main idea, topic, and subtopic.
- Here’s a term many of you Maya users can appreciate: wireframes. (Boy, one thing leads to another, I tell you!) Build wireframes for each unique page layout on your site. Wireframes are a diagram view of your page layout and interaction. And, if you’re an architect, consider these wireframes your blueprints.
Web Design Tips for Navigation Tools
It’s even a good rule of thumb to take visuals into consideration when creating a navigation system for your web pages. Navigation is what takes your visitors from page to page within your website. Your best bet is to make those navigation tools visually stimulating as well as functional. And remember, nobody likes to “talk” to empty-headed blondes. (I can say that because I knew a lot of blondes! Blonde, I should say; however far from empty-headed!)
So, take care to point your links in the right direction, so to speak. After a while of clicking on dead links, your visitors will get bored with even the most visually appealing website and *gasp* leave.
Follow these steps to creating visually appealing navigation:
- Differentiate the visual design of non-clickable and clickable elements; which is to say, don’t use the same graphic as a button on one page and a headline on another. That can be very confusing to your visitors. Besides, it’s the lazy way out.
- Use visual feedback, such as a color change, to enhance interaction and usability. A color change can be applied to both image links and textual links with Javascript (behaviors).
- Always place navigation in the same place on the page and don’t change its appearance. It makes for effortless navigation. The last thing your visitors want to do is work hard to find their way around your website. They gave at the office; enough is enough!
- If you have vague-looking icons, it’s always a safe bet to label them. Images alone are not always clear, and visitors might not understand their function on your site.
Follow these simple tips and guidelines, and you’ll have a well organized and visually pleasing website up and running in no time!