How is a website designed and built?

Preliminaries

The first steps in designing a web site starts with you. Please see our First Steps page. Once you have developed a sense of what you want your web site to accomplish, what style it should have, and about how many pages should be in your web site, it is time to start working with a web developer. Please see our Web Development page for guidance in choosing the right website developer for you.

Domain Name registration
The domain name is the name of your website, myswebsite.com or mywebs.net, etc. Pick a domain name that uses your business name if possible, or describes the types of products or services that you provide. Your domain name must be unique, even if it is only one character different from another web site. But be conscious of the confusion that very similar domain name can cause for your visitors. Try to come up with a unique name using the .com extension if possible.

All domain names are registered in a database run by the Internet Corporation for Assigned Names and Numbers or ICANN for short. ICANN is the non-profit standards company responsible for international domain name registration services. To find out if the domain name that you want is unique or already used go to ICANN's InterNIC website.

Web Hosting

The next task is to pick a web hosting service. For a discussion of what a web hosting service is and how to go about selecting the right one for you, see our Hosting page. Your web site developer will take care of linking the address of your web hosting server to your domain name so that people entering your domain name into their web browser will arrive at your web site.

Home Page Design

Now that the preliminaries are all set, it time to design your home page. Your home page is the most important page in your website. On average, you have about 3-4 seconds to capture the interest of visitors to your website before they bail out and go to another website. A clean, uncluttered homepage loads quickly, informs the visitor about the contents of your website, and how to navigate to the information or products that they are seeking.

Spend a proportional amount of time with your web developer discussing the colors, layout, graphics, navigation buttons, and content of your home page. Have your web site developer build a home page with your ideas and their ideas. Ask your web developer to put your home page up live on your web server. Then live with it for a few days. Ask friends and colleagues for their opinions. Have your web developer make changes. Experiment. Repeat this process until are happy with the result.

Don't rush your home page design. You will want to carry the look and feel and the themes of your home page throughout your entire web site. Your home page becomes your template for the rest of your web site. When you find that you are tweaking minor aspects of your home page, it is time to move on to the next page.

Web Site Layout
During the preliminaries you should have decided on the categories of pages and the approximate number of pages that you want in your website using our First Steps page as a guide. Discuss with your web developer how best to fit all of these pages together so that your visitors can quickly navigate around your web site. Decide on names for each category of your web pages. These can be the standards or personalized. For instance, the standard About Us page could be called About the Artist, or BIO, or Company Info, etc. You will want to name all of the pages in your web site. These names will be used for navigation purposes, so they should inform your visitors about what they can expect to find on a particular page.

If your categories contain two or more pages with different topics, decide if want your visitors to go to a category landing page first or to be able to navigate to the topic page directly from your home page. A category landing page has some advantages. It simplifies your navigation buttons. It gives you a place to tell people about the category of the of the topic pages. This gives you the opportunity to add more content to your web site, and provide more information for your visitors. The disadvantage of having a category landing page is that your web developer will charge you for the page. If your visitors have to go to your category landing page to get to your topic pages, they will have to click twice to get there. A compromise is to have both a category landing page and direct navigation to your topic pages.

Navigation Buttons
Having decided on the layout of your website and how you want your visitors to navigate around your web site, it's time to design your navigation buttons and experiment with their location on your home page. Traditionally, navigation buttons have been placed down the left margin or across the top of your page under your header. There are no hard and fast rules on the placement of your navigation buttons. A couple of guidelines should be adhered to, however. The navigation buttons should be easy to find on the page and they should be in the same place on all of your pages.

Navigation buttons should be visually active. When a user passes the mouse cursor over the button the button or the text on it should change color, or change size, or bounce, or something to visually cue the user that if they click they will be transferred to the category on the button.

If you have decided to allow your visitors to navigate directly to the topic pages in a category, you have a couple of choices for the navigation buttons. You can list all of you topic pages under each category. This can give you a fairly lengthy list of buttons and generally only works if your button are listed down the left or right margin of your page. The advantage is that your visitors can quickly scan for the topic that interests them and navigate directly.

The second option is to provide topic navigation buttons as a dropdown list under or beside each category. A dropdown list is one that appears when the user passes their mouse cursor over the category button and disappears with the mouse cursor move to another part of the screen. This technique give you a short list of category buttons and allows you to place your navigation buttons just about anywhere on the page. Depending on the number of subcategories and topics under each category, these drop down lists can expand one, two, three, or four deep. If your information is well organized, this is an effective approach, especially for large web sites.

If you have chosen not to allow your visitors to navigate directly to the topic pages in a category, you will have to provide topic navigation buttons on your category page. These topic navigation button should be consistent on every page topic page of the category. An alternative is to provide a table of contents on the category page, with forward, back, and return buttons on each topic page. This works well with long text articles.

Page Header
The page header is obviously the area at the top of page. This area wants to be dedicated to your company logo, your company name, and your companies tag line. The page header is typically a box with a different colored background than the rest of the page to set it off. There are no hard and fast rules about the size of the page header or its location, centered, left or right justified or something in between. However, once you decide on the size and placement, you should be consistent across all of the pages of your web site.

The purpose of the page header is to build brand identification and to keep reminding the visitor whose website they are visiting. The more often they see your logo, company name and tag line, the more likely you visitors will remember you and come back to your website.

Page Footer
Your page footer should provide category navigation buttons. This makes it easier for your visitors to navigate around your site. If they have scrolled down to the bottom of your web page, you don't want them to have to scroll back to the top to go to another page.

Providing instructions on how your users can contact you to report problems with your website or suggest improvements, is an important opportunity for you to learn what your users think of your web site, and to make improvements that will enhance their experience.

If your visitors have read down through your page and are curious about your services or want to learn more about your products, they should have a link at the bottom of the page that will allow them to send you email queries.

Although the copyright laws have changed so that you no longer have to file for copyright protection, you should clearing indicate that the material in your website is copyright protected and the year that the material was created.

Give credit where credit is due. If you have used the services of a web developer, graphic artist, copy writer, etc in the production of your web site, give them credit in your footer. They will appreciate it, and will probably give you a reciprocal link on their web sites.

Graphics
Use graphics but use them sparingly. Graphics should add interest to the content of the web pages and should be relevant to the theme of your web site or the content of a specific page. Too many graphics can distract and detract from the message in your text. A large number of internet users do not have high speed internet connections. A large number of graphics makes your pages load slower and cause some of your potential customer to bail out before they get a chance to read your message. Remember the 3-4 second rule for capturing the visitors attention.

Get your graphics, whether photographs, or the work of a graphic artist web ready before you put them on your web site. Using your favorite graphics program resize your graphics to the same size that you want them displayed on your web page and the same density. Web browsers display pictures at about 75 dots per inch or dpi. An 8"x6" picture at 600 dpi is approximately 50 megabytes and will take a 56k modem about 8 hours to download. The same picture sized to 1.5"x 1" at 75 dpi can be downloaded from your web host to your visitors computer in less than 4 seconds.

If you are selling products on your web site it is essential that your customer be see pictures of the products. If the products come in various colors and materials, they should see pictures that accurately represent these aspects of the products before they order. This will reduce your return rate and give your customers a much more satisfactory shopping experience. Keep your pictures web tuned and don't put too many of the on one page.

Content
Content is king. The internet is a visual medium capable of rendering pictures, artwork, movies, animation, and sounds. These are entertaining and can add interest to your website. The internet, above all, is an information resource. Most people use the internet to get answers to questions, whether that's finding products and services, or comparing products and services, or keeping up with news and sports, or writing a term paper. The text on your web page is what they want, the rest is decoration.

The information on your web pages should be useful, clearly written, concise, and factual. If the content of your web site is useful and comprehensive, other web masters will link to your site and send their visitors to you. This builds your customer base. See or SEO FAQS for a discussion of how your content helps your search engine ratings.

Write a draft of your content. Then edit, edit, edit, and proofread until your are satisfied with the message and sentence structure of your content. Give this finished product to your web master in a computer readable format. You know your business and your products and services, your web developer does not. You can pay your web developer to proofread and edit your copy but you can probably get friends and colleagues to do this for you for free.

Keep it Legal - Copyright Protection
The U.S. Copyright office's information circular states "The use of a copyright notice is no longer required under U. S. law, although it is often beneficial. Because prior law did contain such a requirement, however, the use of notice is still relevant to the copyright status of older works.

Use of the notice may be important because it informs the public that the work is protected by copyright, identifies the copyright owner, and shows the year of first publication. Furthermore, in the event that a work is infringed, if a proper notice of copyright appears on the published copy or copies to which a defendant in a copyright infringement suit had access, then no weight shall be given to such a defendant's interposition of a defense based on innocent infringement in mitigation of actual or statutory damages, except as provided in section 504(c)(2) of the copyright law. Innocent infringement occurs when the infringer did not realize that the work was protected.

The use of the copyright notice is the responsibility of the copyright owner and does not require advance permission from, or registration with, the Copyright Office."

Make sure that all of the material that you use on your web site is either an original work, is in the public domain (old works whose copyright has expired), was created by the government, or you have explicit permission from the copyright owner to use the material.