www.your-first-website.com/yfwt/your-first-website-web-page-template.html
In my last post I showed you how to use a simple web page based on the “Your Free Web Page Template”.
Hopefully, you have had some fun creating your own webpage using the template.
More importantly, you will appreciate that you can do plenty with the most basic of webpage layouts possible… a ‘letter’ format.
What the article didn’t tell you about was the way that the template web page layout was managed using tables. It is really easy to do…
Open Mozilla Composer. Keep the blank page and rename it as your test page. Click the ‘Table’ icon and you’ll see a new ‘Insert Table’ window. It will automatically be set to 2 Rows, 2 Columns and 100% of the window.
Because people sometimes prefer to print a webpage to read offline, you’ll find the template is based on a single table set 600 pixels. This controls the overall width so that the webpage will print to an A4 page.
Also, so your website visitor has no problems viewing, the table is positioned centrally.
The settings you need are on your test page are…
1 Row, 1 Column and 600 pixels width
If you want to have a border you can leave the setting at ‘1’ or you can increase it to whatever size you want. If you don’t want a border change the setting to ‘0’.
For the template I provided an additional 3 tables within the main table. This is as easy to do as it was for the first table…
Place your cursor inside the main table and press the return button a few times to increase the depth (I reckon 3 to 4 returns are plenty to begin with).
Next, place your cursor on the second line and open the ‘Insert Table’ icon again. This time change the number of rows to 3.
There you have it. You have created your own web page template just like your “Your Free Web Page Template”…
That was pretty simple, wasn’t it?
So, you’ve had no trouble so far but you fancy changing the webpage background color
This isn’t too complicated…
Find the ‘Format’ text icon and click ‘Page Colors and Background’…
Click on the ‘Background’ button and a color table will appear. Choose which color you want and accept with OK.
This will change the whole webpage color to the color you have chosen… GREAT.
The downside is that the table colors have changed too. Depending upon the background color you have chosen this could make the your text difficult to read. This may not be a problem if there’s plenty of contrast but if the colors are similar tone your words could be lost (Vincent Flanders gives an example of an unreadable website at Dailysucker
Without going into technicalities, the best contrast is black text on a white background, as provided with “Your Free Web Page Template”. This isn’t too hard to achieve with Composer…
Using the text ‘Table’ icon on the top line of Composer click ‘Table Properties’. Now, click the ’Background Color’ button and change the color to white.
You only have to do this for the first table you created. The tables that were placed inside will automatically change to white.
Finally, you will want to position your tables centrally
Once again, open ‘Table Properties’ and alter the ‘Table Alignment’ setting to center.
There you have it…
Your own working webpage template, easily and quickly created by none other than YOU.
-----------
Tables are a simple way of controlling the look and layout of your web pages. You’ll find an interesting article Developing The Grid That Supports Your Design by Emanuel Blagonic gives you more detail about how to develop a more advanced webpage layout.
For more examples of bad web design visit Vincent Flanders’ Web Pages That Suck
No comments:
Post a Comment