How to layout html page with table 2

Website layout with tables 2

The following picture shows an image of a simple website layout using html tables.

In the picture the top part is for display website logo and left down is the content area and right side you can put Menu there and as usual footer is the bottom location.

When you creates a website layout , it is better to avoid nested tables. Nesting tables can lead to complex tables layouts and increase in page load time.

The following HTML code give you what exactly shows in the picture. Copy and paste the following html code and save it as an html file.

HTML Source Code :

<html>
<body >
  <table border=2 bordercolor=red width=98% align=center>
    <tr><td align=center colspan=2>
      <br><br><br>
        WEBSITE NAME
      <br><br><br>
    </td></tr>
    <tr>
      <td  width=70% align=center>
        <br><br><br><br><br><br><br><br><br><br><br>
          You Can write your main content here
        <br><br><br><br><br><br><br><br><br><br><br>
        </td>
      <td  width=30% align=center>
        MENU
      </td>
    </tr>
  <tr><td align=center colspan=3>
    <br>
      FOOTER
    <br>
  </td></tr>
  </table>
</body>
</html>

The content area is filled with HTML < br > (line break) tag for display purpose, so you can replace < br > tags and write your content inside the content area.