How-to design a Web Page

A good web page design requires forethought, planning and a willingness to alter the initial strategy. Before writing even the first bit of code or setting the first icon on screen, it is necessary to know why the web page needs to be created, and that will often guide how to build the site. Secondly, using the reason for the page's creation as a guide, the writer must construct the page logically and must be aware of certain things that can trip up even an experienced web page designer

Knowing the Why Often Reveals the How

1. When building a website, the first thing to determine is the primary reason for the website. This should be something that can be answered in one sentence. For example, "The primary purpose of my website is to tell people about my business." Or, "I want my website to show off the Role Playing Game I made that I can't get anyone else to publish." The "why" will often reveal a great deal about the "how." For example, a business site should be an even split between selling the company's services and informing the public about the company. A web page detailing how to build a desk might put pictures next to the text describing how to do things to help the viewer understand the process.
   
   To sum up, let the website's reason for being guide how the page or pages are laid out.

The Keys to a Successful Design

2. The purpose of a web page is to communicate to the intended audience. Or put more simply, it's designed to tell the visitor some information or insight. When in doubt, keep it simple. While having 20 videos, a dozen links and a bunch of animated pictures may look cool to the creator, it takes the risk of distracting the visitor from the reason they came there in the first place. So, when in doubt, simplify.
   
   Also, consider how long it takes for the page to load. While bandwidth is much less of a problem than it was even a decade ago, it is still a consideration. The longer it takes for a page to load and be viewable, the less likely the viewer is to stay and see the page. Consider using multiple pages to contain and manage the information in question. This also allows for better organization and a better chance of conveying the information. A picture or video that is useful, but not critical to the page might be better linked to the page, rather than on the page itself.
   
   One HTML trick for faster loading is to define the size of the pictures or objects to be loaded on the page. Most browsers will stick a "placeholder" in that spot while the picture loads and will load the rest of the site in the meantime. Also, avoid using background pictures unless they are fairly small and simple, as they can clutter a web page and slow down the loading time of the page, neither of which is beneficial.
   
   Next, if the web page is part of a website (and most are), be sure there is a clear, obvious and easy-to-use index of the pages in the site, which can allow visitors to navigate to other pages within the site. This is especially critical in business-oriented sites. Fortunately, most web page building software packages include this feature.
   
   By the way, be aware of an HTML tag called the "anchor" (A NAME="anchorname"). This allows visiters to maneuver within the page itself. It is an independent tag that functions with a variation on the standard hyperlink (the format is A HREF="pagename#anchorname"). This can be very handy for the written portion of the page, allowing you to expand on key points without disrupting the flow of the web page, but keeping all the information on one page, and it can be used to link from other web pages. I personally use this feature regularly on the site I manage to link to current seminars our company has planned which appear midway down the seminar page, but which we "tease" on our main page. The anchor tag allows the visitor to go directly to the seminar details on the seminar page.
   
   If you are using javascript or vbasicscript with the page, be aware that not all browers support this, either because of the browser's age or because the owner decided to turn it off and leave it off. Be sure to use the NOSCRIPT tag to cover these circumstances.
   
   One other little trick that can help tremendously with layout is to use tables. Most web page building software can create them, and if set to a border of zero, they are invisible on the page, but allow for a much more flexible presentation of the information.
   
   In summation, a good web page should be kept as simple as possible without losing information, have an easy-to-use index if it is part of a website, and be well organized and linked, if necessary, within the page.

Conclusion

3. Good web page design is as much art as it is a science. A good web page is built for a reason, and focuses on that reason with every aspect of its design. It is not overly complicated for the sake of being fancy, and has a logical, easy-to-follow organization.