When creating new website everyone wants to make it unique and pretty. I don’t see any problems with it as long as “beautiful design” does not hurt your website in the long run. There are thousands of designers out there who can create great graphics but have no idea how to make a website:

• user friendly
• search engine friendly

Here are some basic guidelines you should follow to satisfy both - human visitors and search engine spiders.

Let’s start with human visitors…
They are the primary target and will define if your site worth to look at. Your goal is to get them interested from the first visit and willing to come back for more information again and again…

Make your site to load as fast as possible

Two major elements that slow down your website are images and external scripts. Always slice background images to the smallest elements possible and optimize them for web.
If you have more than one script powering up your website, like blog and directory for example - create one common “images” folder and use it for both templates.
For all bullets and roll-over elements always use CSS Preload so there is no delay when hover the menus or switching from page to page.
I also recommend to preload any large images, especially if they are located on popular pages of your website.

Be very selective in using widgets or any external scripts on your website - they may freeze your page. Stay away from all those stupid counters and cut statistics scripts to the minimum. If you have a choice - use html/php scripts instead of java and place widget or banner graphics on your own server if possible.
Any flash element will slow your website - try not to use them or cut to the minimum.

Make website navigation clear and consistent

Nothing annoys visitors more than bad navigation! Make sure to place navigation elements in visible area and keep it consistent from page to page. Every page withing your site should be reachable with no more than 3-4 clicks otherwise no one will go there…
If your site has a lot of sections with many deep pages - consider to use drop-down menus to reach those pages faster. Great option is a breadcrumb menu - use it if you can…

Choose amount and type of ads carefully

Everyone wants to make money with his website but remember that visitors are coming for the content, not advertisements. DO NOT stick bunch of ads, pop-ups, fly-ins, anything talking/singing/screaming in front of visitor before he can see what the site is about. All this stuff may earn you one accidental click but loose visitor forever… Analyze which types of ads and areas of ad placements are working the best and get rid of the others.
Display only advertisements directly related to the theme of your site, otherwise you are just wasting ad space and disturb visitors - no one will click on those ads…

Now let’s talk about search engines.
Search engines algorithms are constantly improving in order to being able to recognize content similar to humans and define content quality.

Use external CSS and script files

To keep your pages clean and increase % of content comparing to code. Search engines love content and can easy separate it from the source code. Using external files will also improve page loading time and prevent from potential validation errors.

Properly use meta tags, title tags and alt tags

The first thing search engines see when accessing your pages are meta tags. Make sure always have title and description mata tags inserted in the head section and filled up for EVERY page. Do not use same titles and descriptions for multiple pages - this is a duplicate content and I will talk about it later…
Since search engines can not actually “see” - always insert and fill out alt”" tags for images you are using on the page. Make those descriptions brief but relevant to the subject you are talking about. For example “picture” or “pic1″ are not good descriptions…
In addition to the anchor text for internal links include “title” tag with description where this link will take you. Sometimes you can not use desired text for the anchor - at least you will have descriptive title tag.

Validate your pages for errors

Even though I am not a huge fan of w3c validations it is always good to check pages for major errors. Most of the time errors could be created by included widgets or java-scripts (another reason not to use too many). At least check that your page validates according to the declared DOCTYPE and does not have any broken links.
Validating CSS is also very important for your website to work properly in multiple browsers.

These are just a few basic tips to keep in mind when creating or updating website. If you are planning to hire someone to do web design work for you - always ask for samples of created websites and try to check them for the elements I described…

Tags: Images, w3c, Webdesign, Website Development

Posted July 12th, 2008 at 4:37 pm in category CSS and Web Design, Website Development. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.