Web Page Structure and the Effects on How Your Page Works

By  |  In: Website Development | Tags: , , ,  | 0

Web Page Structure

Webmasters have different ideas about how to structure a web page. Here are a few tips on how we build pages.

Its important to have all of your “Links” at the top of the page and use tricks to move them around, such as putting the “Footer” at the top of the page in the “Code” and using “CSS” to move it down when the page is rendered.

The reason we do this is because the “Search Engine Spiders” read the code of the page from top to bottom. Some people live by this rule but others say it is a bad practice or even “Black Hat” SEO.

In my opinion, it is best to start at the top of the page and work your way down. In saying this you first need to decide on the major “Parts” of your web page and how you want to lay out the page.

If you have a “Block” that has your logo and main navigation and  runs across the top of your page, you can make that your first “Block” ( I like to call it the “header” ) .

The next item is the “Main” content of your page. This may include a left-side, middle, and right-side and I like to wrap these items inside a “Block” ( usually called “Content” ) . If I have anything on the left I like to start there and then move on to the middle. Finally I will focus on the items on the right side of the page.

The last “Block” is the footer that contains  info about your site , as well as links to the sitemap and other pages ( this completely depends on what you want to add to it ).

The reasons I do this is to keep the code of the page clean and easy to read. With items in the proper order I find that you don’t have to “Negative” items left or right in the “CSS”.  It  also allows the page to load quicker because the items that need to be loaded first are at the top of the “Code”.

As I said before, this is my opinion and and there many others who have different ideas on how it is done and there are times when you have to change how you do it, such as if you have a “header” that only goes across 90% of your page and a “left-side” or “right-side” that run from the top of your page down to the bottom.

If you want to see a example of how I do a basic “Web Design” click on the image or here to see a text example.