More On Tables for Web Page Structure.

As we’ve said in previous tutorials, Tables provide website builders with an invaluable tool when adding structure to a webpage. Structure ensures that the content (both text and images) is laid out in such a way, which allows website visitors to read and take it all in easily. Dividing the various sections of information up on a webpage provides each of those sections with a more prominent share of the spotlight. Overall, structure makes the first impression of a webpage far more aesthetically attractive and so encourages viewers to stay for longer and take in more information.

One of Table Properties options is Merge Cells, which we’ll look at now.

To start with, place your cursor on the spot on your page where you want your table to sit. Click the Insert Table icon on your editor icon bar and choose the number of Rows and Columns you need. For this tutorial, you’ll need at least three of each. You can always go back and add or remove rows or columns later.

Alternatively, you could edit an existing Table by right clicking anywhere in the background of any of the cells and going down to Table Properties. Add a few more rows and columns to play with, so you dont affect your existing contents layout.

Once you have your table in front of you, let's look at turning the top row into a title row. In the example table it’s currently made up of 3 cells due to the 3 columns but we need that top row cell to be just one cell. To do this, left click once to place your cursor in top left cell then right click and go down to Cell, then to Merge Right. The column line will disappear leaving two cells instead of three. Now do the same again in the new larger cell to remove the line and create just one large cell across the top of the table. You can now centre any text to create a title for your table.

The same can be done to create a tall cell down the left or right hand sides of the table. This is ideal should you have a tall image for instance, which you may want to sit to the right of some text. Left click in the right hand cell on the second row underneath our new title row. Now right click and go to Cell, then to Merge Down. The row line will disappear leaving a tall cell spanning two rows.

Adding, Removing and Merging Rows and Columns gives you the flexibility to create whatever format of table you need. Use this flexibility to give clear structure to your content.


Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
This blog is running version
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','','ga'); ga('create', 'UA-2227312-2', 'auto'); ga('send', 'pageview');