Build Your Website Right - First Time
Category: Website Design and Development | Date: 2003-10-25 |
Building a Web site is simple. Anybody can do it. However, building one thats good requires effort. And what you really need is a site thats not only great, but is easy to keep that way. Easy to maintain. Easy to update. This is how you do it.
First, before you do anything else, you must ask yourself a fundamental question, "What is the purpose of the site?"
It could be to directly sell a product, or perhaps to get people to join your mailing list, take part in a game or competition, or even call a sales representative. Whatever it is, you must identify it clearly. Every part of the site should be designed with the aim of fulfilling this objective.
Identify your customer. Who are they? Picture them. Whats their job? Income? How old are they? What are their interests? Their personality types? Write this information down and refer to it often. Build your site for THEM. Not you.
PLAN IT OUT FIRST
Now you know the sites purpose and its intended audience, you can think about various sections you will need, and the topics to be covered in each. Aim for a maximum of five or six main sections. More than that and visitors will have trouble
remembering them.
Draw a plan of your site on paper, with arrows to show how the sections will link together. Links should fan out from the home page like branches on a tree. Visitors should be able to reach any page within three clicks (and return home in one).
Sketch the different page layouts you will need. Keep these to a minimum for continuity within the site. You might have one layout for your homepage, a generic layout for each of the section indexes, and another standard design for sub-pages. Try several alternative styles and select the best.
HELP THE ROBOTS TO HELP YOU
If using a tables-based layout, put navigation links and drop-down menus, etc., to the right of the page. If you put them on the left, the code will appear at the top of your HTML file. Search engines place a lot of emphasis on the information they find there, so why start at a disadvantage? Have your keyword-rich content at the top, not links.
(If navigation must be on the left, clever use of the rowspan command can order your code, but ensuring consistent alignment of the tables in different browsers is tricky. Craig Fifield has a simple example at http://siteowner.com/tabletrick.html ).
PLAN FOR CHANGES
Identify components of your layout that will be repeated across many pages. Things like navigation menus, page headers and footers, etc. Mark these to be added to your pages through the use of Server Side Includes (SSI).
With SSI, a simple CGI command within the page, instructs the browser to include the contents of another file at that location. This way, if and when you need to modify, say, the navigation menu on every page, you only have to change the contents of a
single file. To learn more about SSI visit: http://www.ora.com/www/info/cgi/ch05.html
Open your HTML editor. Using your sketches, create a template file for each of your chosen layouts. Include everything that will be the same on each page.
<--- Side Note --->
SSI can only be viewed when pages are online, so unless you have an advanced editor that can display them in place, I suggest you make two templates for each page type.
First create an entire page as you intend it to appear in a browser. When finished, add HTML comment tags to mark the start and end of each component that will use SSI. Save the file. Use it for reference and testing modifications to your included sections.
Now select the area between the first pair of comment tags. Cut and paste the HTML into a new file of its own. This will be the include file the browser will reference. Replace the cut section with the appropriate SSI link to the new file. Repeat for each
SSI section and then use the Save As command to save what you are left with as a new template. Use this template to create pages.
<--- Side Note --->
CREATE A SITE THAT DOWNLOADS FAST
Dont use FONT tags in your HTML. Use Cascading Style Sheets (CSS) to specify font face, weight and color, etc. The vast majority of surfers are using browsers that understand the basic implementation of CSS that covers font information.
File sizes are greatly reduced without FONT tags, making pages download faster. Plus, if you ever want to make adjustments, modifying a single line in a style sheet file can effect font styles on every page. To learn more about CSS visit:
http://www.w3.org/Style/CSS/
Keep the number of graphics and their file sizes to a minimum as they add considerably to page download times. Use fewer colors and compress images as much as possible. Once downloaded, images are stored in the browsers cache for instant retrieval. Take advantage of this by using the same images on multiple pages.
Avoid large pictures. If their usage is central to your sites theme, compress and save them in interlaced format. Though actually taking slightly longer to fully download, this will cause them to gradually fade into the page, so your visitor isnt left staring at a blank space.
USING KEYWORDS AND TEXT
Research keywords your target audience will type into the search engines to find you. Spend some time on this. Create a list of words and their synonyms. Divide them up to match your topics. Highlight the most important words and phrases in each.
Write the copy for each of your topics. Initially, just let the words flow. Write down anything that comes into your head.
Go back over your copy and refine it. Again and again. Highly focused pieces will help you with the search engines. Work your keywords into the text and identify possible headlines. Use short sentences and make it as crisp as you can. Write in a language and style that will appeal to your target audience.
Now youre ready to start creating pages. Paste your copy into the appropriate template. If its a sales letter, allow the copy to run its entire length on a single page. Otherwise, look for a suitable break point at around one-and-a-half screen lengths. Use an unanswered question or incomplete sentence here to stimulate your visitor to click to the next page.
Short pages can be annoying to visitors. With a slow connection, they will spend a lot of time waiting for pages to load. However, its harder to get good search engine rankings with long pages.
Use a level one heading (H1) containing your most important keywords at the top of each page. Search engines consider these important in determining relevancy. Have plenty of keywords in the first paragraph or so of text. Keywords in file and directory
names may also help your ranking a little in some search engines.
With a little thought and preparation you can design a good Web site from the outset. One that does the job it was intended for, and stands a fair chance of getting decent search engine rankings. Youll also have a site that is easy to modify, just in case you didnt get it quite right first time!
© 1999-2000 Azam Corry "Do it Better. Do it Faster. Do it Right!"
About the author
Azam Corry owns Now Sell! Bursting with FREE information, tools and resources to help you profit. NowSell.com/?WSRight Web Consulting, Site Design and Makeovers. iCop Founding Member.
==> Get Azams Biz Bits, viewed a "must read" ezine by thousands of online business owners: mailto: NowSell.com
BizBits@NowSell.com
http://www.NowSell.com/?WSRight
First, before you do anything else, you must ask yourself a fundamental question, "What is the purpose of the site?"
It could be to directly sell a product, or perhaps to get people to join your mailing list, take part in a game or competition, or even call a sales representative. Whatever it is, you must identify it clearly. Every part of the site should be designed with the aim of fulfilling this objective.
Identify your customer. Who are they? Picture them. Whats their job? Income? How old are they? What are their interests? Their personality types? Write this information down and refer to it often. Build your site for THEM. Not you.
PLAN IT OUT FIRST
Now you know the sites purpose and its intended audience, you can think about various sections you will need, and the topics to be covered in each. Aim for a maximum of five or six main sections. More than that and visitors will have trouble
remembering them.
Draw a plan of your site on paper, with arrows to show how the sections will link together. Links should fan out from the home page like branches on a tree. Visitors should be able to reach any page within three clicks (and return home in one).
Sketch the different page layouts you will need. Keep these to a minimum for continuity within the site. You might have one layout for your homepage, a generic layout for each of the section indexes, and another standard design for sub-pages. Try several alternative styles and select the best.
HELP THE ROBOTS TO HELP YOU
If using a tables-based layout, put navigation links and drop-down menus, etc., to the right of the page. If you put them on the left, the code will appear at the top of your HTML file. Search engines place a lot of emphasis on the information they find there, so why start at a disadvantage? Have your keyword-rich content at the top, not links.
(If navigation must be on the left, clever use of the rowspan command can order your code, but ensuring consistent alignment of the tables in different browsers is tricky. Craig Fifield has a simple example at http://siteowner.com/tabletrick.html ).
PLAN FOR CHANGES
Identify components of your layout that will be repeated across many pages. Things like navigation menus, page headers and footers, etc. Mark these to be added to your pages through the use of Server Side Includes (SSI).
With SSI, a simple CGI command within the page, instructs the browser to include the contents of another file at that location. This way, if and when you need to modify, say, the navigation menu on every page, you only have to change the contents of a
single file. To learn more about SSI visit: http://www.ora.com/www/info/cgi/ch05.html
Open your HTML editor. Using your sketches, create a template file for each of your chosen layouts. Include everything that will be the same on each page.
<--- Side Note --->
SSI can only be viewed when pages are online, so unless you have an advanced editor that can display them in place, I suggest you make two templates for each page type.
First create an entire page as you intend it to appear in a browser. When finished, add HTML comment tags to mark the start and end of each component that will use SSI. Save the file. Use it for reference and testing modifications to your included sections.
Now select the area between the first pair of comment tags. Cut and paste the HTML into a new file of its own. This will be the include file the browser will reference. Replace the cut section with the appropriate SSI link to the new file. Repeat for each
SSI section and then use the Save As command to save what you are left with as a new template. Use this template to create pages.
<--- Side Note --->
CREATE A SITE THAT DOWNLOADS FAST
Dont use FONT tags in your HTML. Use Cascading Style Sheets (CSS) to specify font face, weight and color, etc. The vast majority of surfers are using browsers that understand the basic implementation of CSS that covers font information.
File sizes are greatly reduced without FONT tags, making pages download faster. Plus, if you ever want to make adjustments, modifying a single line in a style sheet file can effect font styles on every page. To learn more about CSS visit:
http://www.w3.org/Style/CSS/
Keep the number of graphics and their file sizes to a minimum as they add considerably to page download times. Use fewer colors and compress images as much as possible. Once downloaded, images are stored in the browsers cache for instant retrieval. Take advantage of this by using the same images on multiple pages.
Avoid large pictures. If their usage is central to your sites theme, compress and save them in interlaced format. Though actually taking slightly longer to fully download, this will cause them to gradually fade into the page, so your visitor isnt left staring at a blank space.
USING KEYWORDS AND TEXT
Research keywords your target audience will type into the search engines to find you. Spend some time on this. Create a list of words and their synonyms. Divide them up to match your topics. Highlight the most important words and phrases in each.
Write the copy for each of your topics. Initially, just let the words flow. Write down anything that comes into your head.
Go back over your copy and refine it. Again and again. Highly focused pieces will help you with the search engines. Work your keywords into the text and identify possible headlines. Use short sentences and make it as crisp as you can. Write in a language and style that will appeal to your target audience.
Now youre ready to start creating pages. Paste your copy into the appropriate template. If its a sales letter, allow the copy to run its entire length on a single page. Otherwise, look for a suitable break point at around one-and-a-half screen lengths. Use an unanswered question or incomplete sentence here to stimulate your visitor to click to the next page.
Short pages can be annoying to visitors. With a slow connection, they will spend a lot of time waiting for pages to load. However, its harder to get good search engine rankings with long pages.
Use a level one heading (H1) containing your most important keywords at the top of each page. Search engines consider these important in determining relevancy. Have plenty of keywords in the first paragraph or so of text. Keywords in file and directory
names may also help your ranking a little in some search engines.
With a little thought and preparation you can design a good Web site from the outset. One that does the job it was intended for, and stands a fair chance of getting decent search engine rankings. Youll also have a site that is easy to modify, just in case you didnt get it quite right first time!
© 1999-2000 Azam Corry "Do it Better. Do it Faster. Do it Right!"
About the author
Azam Corry owns Now Sell! Bursting with FREE information, tools and resources to help you profit. NowSell.com/?WSRight Web Consulting, Site Design and Makeovers. iCop Founding Member.
==> Get Azams Biz Bits, viewed a "must read" ezine by thousands of online business owners: mailto: NowSell.com
BizBits@NowSell.com
http://www.NowSell.com/?WSRight
Copyright © 2005-2006 Powered by Custom PHP Programming