List of Best Web Construction Practices

I am trying to understand all of the most important Web construction practices that ensure that your Web site is as compatible and user-friendly as possible. So far, I have come up with the list below.

Do you agree with the list? Can you add anything to it?

1. Make sure that your markup is valid.
2. Code for compatibility with all major browsers and operating systems.
3. Use a fluid layout so that your site fits most screen resolutions, or use a fixed pixel width no more than 750px for the same reason.
4. Make sure that the size of your font is designated in ems or a percentage so as to allow users to enlarge it.
5. Design the site as such that, if images or CSS are disabled, the content is still accessible.
6. Use a <noscript> tag to provide alternate content for users that have disabled scripts in their browsers or have browsers that don’t support client-side scripting.
7. Make sure that all image alt attributes are given properties in order to facilitate screen readers and users who've disabled images. Use an empty title attribute if you don't want IE to display a tool tip.
8. Use blue as your link colour, since it's the universally recognised colour for links. Accordingly, don't use any other blue text.
9. Make sure that a generic font (e.g., sans-serif) is included in your designated fonts. All standards-compliant browsers facilitate generic fonts, so you will have something that they can fall back on if necessary.
10. Break multiple items into groups of four or less. For example, if you have a horizontal menu with 16 links, try to separate them into themed groups of 4 or less. The brain has to work much harder to pick out individual links from large lists.
11. Always use dark text on a light background.
12. Put the main content on the left-hand side of the page, and menus on the top or right-hand side. In the English-speaking world, we are trained to look first at the left-hand side, since we read from left to right.
13. Use as few images and as less markup as possible in order to keep download speeds fast.

 

I would not put validation as #1 because w3c validation does not factor into ranking in Google.

 

This has nothing to do with Google PageRank. It's to do with usability and compatibility.

And I should have made it clear that I present the list in no particular order.

 

I'm usually not a stickler, but pagerank and search engine rankings are not the same thing. FYI...

I can't completely agree with your list... The dark text on light bg is preference. The content on the left side, also preference.. Actually, I would only consider a couple of those items "best pratices" and the rest is just filler. The fluid layout is something that I don't agree with because some designs may break or collapse with fluid layout.

The thing about the 750px layout is also not really a best practice either. If we're going by industry standard, the most common wrapper width is 960px. Actually, there has been a lot of data taken about the proper width, and nowadays, wider is better (within reason, less than 1000px).

Valid markup is important, but most current programs or WYSIWYG editors already export valid markup, so unless you're using notepad, you shouldn't have to worry too much. I know DW can clean up code so it's valid pretty easily, so..

The thing about images is that you don't have to eliminate them, you have to make sure that they are optimized. I generally use PNGs for almost all of my designs, and my pages load fast. You say use as little markup as possible, but the markup isn't really going to load any faster or slower. It's the only thing the browser will understand. You may want to rephrase by saying something about JS or something that is a little more system intense.

Using blue as the universal text color is also not a good idea. It looks ugly, and it's a pet peeve of most designers. There are other ways to make sure that the link stands out.

I assume that your practices are based on your experience designing, and I'm sure you have a good way of implementing them. I like your list, I just don't agree with most of it.

 

I agree with all said above - nice, I didn't have to say it!

 

HAHA! Thanks

 

That's fine. Please help me refine it.

No, it's not.

This list is about usability and compatibility. Many people, including myself, find inverted colour schemes (light-on-dark) difficult to read. I, personally, can't look at white writing on a black background for more than a few minutes.

No, it's a fact.

We in the English-speaking world start from the left. Therefore, putting the main content on the left-hand side increases usability, albeit just a little bit.

Please explain. I want to learn this stuff. How might it break or collapse?

What about the 4% of users still using 800x600? Wouldn't a 960px layout be too big for their screens?

I write my own markup, and so do many other people. Errors can cause problems with standards-compliant browsers.

The fewer images you use, the faster your page will download - even if all of the images have been optimised.

I'm sure that the amount of markup does affect download speed, even if it's unnoticable and negligible.

Not a good idea?

Blue is the universally recognised colour for links. I would therefore conclude that blue links are the most user-friendly. I'm not saying that all links must always be blue or that it's wrong to have links of a different colour.

Remember, we're talking about usability and compatibility.

That's cool. It's all about learning. I want to know your opinions. I appreciate the response.

 

With regard to this specific point I'd say that although it's obviously true that a page with less images will load faster, images can enhance a website so much that it is worth it. We live in an age of high speed internet access, and it's only getting faster, so properly compressed images and plenty of them isn't really too much of a problem anymore.

I've always been fond of placing plenty of images on my sites and I've never had a problem with slow loading times, not even on my old work connection which was incredibly slow.

I would say this used to be the case more than it is now. Back in the days where websites were simple and mostly made of text it was common to have blue hyperlinks. These days I would say there is a lot more flexibility. When I'm looking for links I certainly don't look for blue text, I look for some other feature, such as underlining or a difference as my mouse rolls over the specific text. Unless blue text fits in with your theme it can seem really out of place and unattractive.

Think all my other points have already been mentioned. Great idea though and a good starting list.

 

Valid points.

But the fact remains that the fewer the images, the faster the download speed. Of course there are other things that can slow down the speed, but we're not talking about them.

And blue is still the universally recognised link colour. If you saw blue text, you would think that it's a hyperlink. You would hover over it to check to see if it is. I know I always do.

Are any of those statements incorrect?

Let me repeat the point of this thread . . .

I am talking about usability and compatibility. I'm not saying that my list represents the best Web construction practices; I'm asking if they are the best practices with regard to usability and compatibility.

I would also like to know if anyone can add to the list.