Merits of Good Web Design

Good web design is about reaching the widest possible audience. To reach the widest possible audience you must design with two thoughts in mind web standards and accessibility.

Accessible designs allow users to resize text even non-compliant browsers like Internet Explorer 6. They provide alt tags for images, in case someone is using a text browser, and those alt tags are descriptive of the images so that those users can gain value from them. They offer a design in which the user can skip navigation and get right to the content both for ease of use and for someone using a text browser. Many people don’t realize when they’re designing a site that the source code is how text browsers will read their site so if you have the header, navigation ads and all other non-content related items before the content in the source code than people using those browsers will have to navigate through that on each and every page. Offering them an alternative to that is one of the keys to accessibility.

What many people don’t realize is that is also how search engines read their sites. So by making your site more accessible you are making it easier for search engines to decipher what exactly is important on your site increasing your rankings and making it easier for them to understand the keywords that your site should rank for.

Web standard based designs function in much the same manner. Designing with web standards means separating content from appearance. Anything that does not deal directly with the content or present some semantic value to your site should be relocated to the CSS. You place all your non-semantic images backgrounds, bullets, etc, colors, font sizes and faces into the CSS. Then your (X)HTML contains only the relevant markup in semantically correct tags H elements for headers, strong for important text, p for paragraphs, em for text you want emphasized, ul/ol for lists, li for list items, dd/dl for definition lists and items, etc. You can then use additional classes and ids on those elements to style your site and match almost any design you can come up with typically with additional div and span tags used sparingly to help provide additional hooks for your CSS.

Designing with web standards also allows you to optimize your site for search engines since you are now declaring to them what your header elements are including hierarchy, what the title of each individual page should be using the title tag, one of the highest ranking SEO tags; and laying out the content with semantic tags so it is able to electronically “read” your content and make keyword associations like the human eyes does naturally.

So by practicing good design you are not only naturally increasing your audience by allowing the largest number of users to view your site but also helping to improve your rankings in search engines for terms relevant to your content. In addition, by separating content from appearance you can easily update the look of your site by changing the CSS and potentially adding a few more hooks cutting redesign time drastically.

In conclusion, good design means using accessible designs and standards compliant code. This brings you the largest possible audience, the lowest possible redesign time for future updates, lower bandwidth (because CSS is cached), and search engine optimized code.

Random Tidbit: The Google maps flight sim is pretty cool.  Though I wish they had more cities.