skip to content
.
logo picture logo text
Breadcrumb trail for Web Design:
Web Design -> Planning -> Best Practices -> Basic Skills -> Building -> Special Pages --> Publishing -> Testing -> More

The Right Way and the Wrong Way

Each web designer has his or her own opinions what is most important. Generally, it is not a bad idea to view a number of articles about best practices to gain an insight into the important things to do - or not to do - as well as to gain understanding about why the practice is important.

Below, you'll find a few practices that many consider important:

Importance of Navigation

No matter the size of your website, your visitors will need a way to get around to see what is there. Visitors won't be happy if they can't find what they came to find or if they get lost in a maze and can't find their way out.

If your website is small, you'll probably want a main navigation menu that links to every page. If you have a larger website, you may want links to your main section pages on every page and have special menus on certain pages. 

Recognize that links can become broken over time, so it's wise to establish a routine for locating and fixing broken links. w3schools.org provides a tool to check for broken links: http://validator.w3.org/checklink

Images

Resolution

Because of the nature of the internet, images that are in lower resolution will display as well as those in high resolution. It's a good idea to resize and/or optomize images used on a website to reduce the time it takes a page to load. There are online sites where you can optomize an image or you can use some graphic software that you have or can download.

Setting Width and Height

You may have visited a website that seems to jump around when the page is loading. Generally this is because the width and height of an image has not been specified. So, the browser redoes the page as each image loads. If you specifiy the size of the image in your code, the browser will layout the page with space set aside for each image, so the page load is much smoother.

Some HTML editors will automatically add the width and height when you insert an image. If you are coding by hand, you can add the width and height to your image tags.

Adding an alternate name

It's recommended to add alternate text to certain image tags. If that's done and an image doesn't load for some reason, an alternate text will appear telling what the image would have been. More importantly, it helps with accessiblity for visitors who are using screen readers, etc.

Links with More Information:

If you want to know more, you might find interesting information at these sites: (Links will open in new window)

The 10 Most Common Mistakes Web Designers Make http://www.noupe.com/design/ten-most-common-design-mistakes.html
Non Profit Website Design: Examples and Best Practices http://www.smashingmagazine.com/2009/05/14/non-profit-website-design-examples-and-best-practices/
Web Design Best Practices Checklist: http://terrymorris.net/bestpractices/

Next Section: Basic Skills-->