You are seeing this very light version of the page, as you are using an outdated browser!

Onlinetools.org is done in XHTML 1.0 and supports CSS 2.0, please upgrade your browser if you want a better version of this site.

Thank you, please help us developers keep up with the industry rather than patching our code for outdated applications.

open or close right navigation

Show your content - search engine friendly HTML tables.

Advertisement:
 
written by:Christian Heilmann on 26.04.2002
Table of contents:

Show your content!
The pain in the spine
Breaking the Spine

 

Show your content!

Sometimes the HTML programming syntax and the way web applications work does not quite mix. Search engines for example "see" webpages completely different than the surfer. And yet, they are needed to lure surfers to your page. With a simple tweak to a very common HTML layout you can satisfy both...

The pain in the spine

A normal webpage layout looks like this:

<table width="90%" border="1">
<tr>
    <td width="20%">Left Navigation(Spine)</td>
    <td width="80%">Content</td>
</tr>
</table>

For a user the spine is displayed to the left of the content, a user can read the content right away.

A search engine however "reads" the document line by line, and normally stops scanning after 200 characters. With a table layout like this, the navigation data will be scanned and the much more relevant and interesting content will be skipped.

To avoid this you need to shift the content further up in in the source code.

Breaking the Spine

Now, to put your content into the limelight , all you need to do is to tweak the HTML of the table a bit.

<table width="90%" border="1">
<tr>
<td width="20%">&nbsp;</td>
<td width="80%" rowspan="2">Content</td>
</tr>
<tr>
<td width="20%">Left Navigation<br>(Spine)</td>
</tr>
</table>

This way, the display stays quite the same, but the order of the elements in the source code is changed. Instead of the long navigation, there is now only one line, and the content gets scanned first.

This also helps editing the content of the pages, as you don't have to scroll through the whole navigation before reaching the real content.

Back to top

Search:

 

Font:

Click to decrease fontsizeClick to increase fontsize

Text-colour:


Background:


sponsored by :

NWU

Help Onlinetools.org

Help onlinetools.org, donate via paypal

Partners

easyPHP

icons

Link to us

copy the code here:


Powered by EasyCMS