Getting Started
How do I make a page? What is HTML? These are the kind of questions that are answered at Getting Started.

Design
Take a look at sites you like and see how they are put together: Cool Home Pages, World Charts, Design Agency and the Webby Awards list sites of merit. Webmonkey, irt.org, HTML Writers Guild WWW Development Resources and Creating Killer Web Sites show the way, but it can be useful to see what not to do by looking at Web Pages That Suck. Yale's Web Style Guide, Macmillan, WDVL: The Illustrated Encyclopedia of Web Technology, and Builder.com are valuable resources as well.

Content
As the author of Web Pages That Suck is fond of saying, 'Content is King'. If you have no content then unless the visitor is a relative or a close friend, they will quickly leave. Decide and create the content before building the site. Prioritize: Good Content Bubbles to the Top. If you are creating a business site, read the ClueTrain Manifesto which talks about business and the Internet.

Home
The first page of a site (after the Splash page) is frequently referred to as the 'Home' page. This is the most important page of the site, The Top's Gotta Pop or They're Not Gonna Stop. Consider your Home page the equivalent of the cover for a magazine. Like a magazine cover, it not only must look good but it must hint at what's inside. It must be carefully crafted to entice the visitor into exploring the rest of the site. Having a link on the Home page that leads to a more interesting site can be bad. A graphic link to another site is worse, since it also visually competes with the content on your page. Instead, make a links page and list external sites there.

Bandwidth
Adding graphics to a page can make it more attractive, but it can slow down loading. The Bandwidth Conservation Society has the conviction that there is a balance between a pleasing page and an economical, low-bandwidth delivery of that page. Try to keep the total size of a page down to 40-60 KB. Unless it is a work of art, a slow-loading page will cause visitors to leave. Research has shown that a fast response time is one of the most important factors to a visitor. The loading of your site can be checked with a variety of simulated modem speeds using WebSpeed Optimizer.

Resolution
To make a well behaved site, design it for the screen resolution of your target audience. A larger size means more design freedom, but a smaller audience that is capable of viewing it properly. 800x600 is probably the largest minimum size you can get away with, some use WebTV, there are still a few people on older machine running only 640x480, with a growing percentage running at 1024x768 or higher (1500x1200). Keep in mind that not everyone visits with a browser that is maximized.

Design not only each page, but each screen-full that the visitor will see. A common mistake is to create a page that shows the site title on the first screen-full and little else. A typical page should be 2-6 screens in length, don't expect a visitor to read much more than that. Viewers prefer shorter pages, and will remain to view the rest of your site if they do not have to scroll through many pages to find the information they require.

Navigation
Every designer must carefully consider their approach to site navigation, especially for commercial sites. If your site navigation isn't well thought out, your visitors will quickly leave. The design must be made before any work is done because a change in approach can take a considerable amount of time. Draw out the navigation for your site on a sheet of paper, make sure that it's easy to get to any page. Create a clear navigation system unless it's for an arts site.

A common method of site navigation is to have a list of links to other pages down the left side of the browser. There are two main ways of doing this, using Frames or Tables. Frames are a way of dividing up the browser window, each section can contain it's own HTML page (see Advanced Page Layout: Tables and Frames, and Using Frames). With Frames we have a narrow frame on the left with an HTML page containing links, the right frame containing an HTML page with the content. If you do not define the border width as zero, a moveable bar will appear between frames allowing the user to re-size the frames as they see fit. The alternative is to use a table, placing the links in the first column of each line, and the content on the right. There are advantages and drawbacks to each, some feel that Frames Suck Most of the Time (1996). For example, early versions of browsers (pre Netscape and Explorer 3) did not support frames. Other issues are bookmarking (the browser just bookmarks the frame page) and search engines (some get confused). However, Frames are quicker updating, give your site a consistent look, easier to maintain, faster loading, and better for printing. They also allow the navigation to stay in view if the user needs to scroll. Because of Frame issues, and the difficulty in implementing them well, beginners are recommended to stay away from frames. Another consideration is using an Image Map. In this case, you specify a picture with a list of coordinates and links. Image maps can be used with both the table and frame based navigation methods.

Colors
The color scheme is a very important design consideration for a web site. When selecting colors for text and background, make sure there is sufficient contrast to allow easy reading. Avoid background images with high contrast, they can make reading almost impossible. Use browser safe colors to avoid dithering on computers limited to 256 colors. To overcome this limitation, ColorMix creates smooth dithering colors useful for backgrounds. A List Apart has a helpful article on browsers and color. For those using Internet Explorer, use the following controls to experiment with colors (a browser color is the result of adding various amounts of Red, Green and Blue together). Note that only colors using 00, 33, 66, 99, CC and FF are browser safe.    Palette Map    Color Names    Color FAQ

Security
You may want to avoid placing photos of yourself, your relatives or anything that indicates where you live on your site. Some Home Page providers have password protected albums. Alternatively, for family only pictures, just don't link or report the URL (Universal Resource Location or address) of your private pages to anyone. Avoid spam emails by using this Email address encoder to hide from E-mail extractors and search engines.

Copyright
While copyright exists from the moment the work is created, placing a copyright symbol and your name on the pictures for your web site will give you an extra level of protection. Those concerned can take this a step further by using Watermarks and Digital IDs or a software solution such as ImageSafe. No method gives you 100% protection. To defend against copyright infringement in court, however, you must file with the U.S. Copyright Office (see #13, 14 and 16.) Here are 10 Big Myths about copyright explained, more detail can be found at Copyright and Fair Use. Recently, IPIX actions have caused much consternation among the virtual reality community (360 degree panoramic images). IPIX charges a per image licensing fee and their agreement seems to imply ownership by IPIX. Finally, use licensed or your own artwork, it's not only a good idea - it's the law! Read more at What Is Copyright, Law and the Web, and Terla. You can prevent other sites from linking to your graphics with a CGI script from Mike's World called Bandwidth Bandit.

Continue in Create...