Page layout in iWeb

iWeb for Musicians

Page Layout

Main Navigation:

Introduction Using iWeb Audio Files Website Music Players Selling On A Website Search Engine Optimization

Music Distribution Website Marketing Photos & Image Manipulation Banners & Slideshows Movie Players HTML Snippets

Laying out your page sections

The best template’s to use to start a custom page are the “Black” and the “White” ones. Start with a blank page.

First, go to the “Page” inspector and uncheck the two boxes to get rid of the standard iWeb navigation. I’ll explain why later.

Then delete the line that’s left at the top of the page, the box that say’s “Text” and then click on the space that this box occupied and delete the box that is used for your “header” text that is lurking underneath.

Next, specify the page width and header and footer height. This is done in the “Page” inspector “Layout” menu. The default page width is 700 px. Iincrease this to 980 px. The header height on this website is 250 px and that is high enough to accommodate the page title, the icons and the main navigation menu.

The footer height is 150 px. This contains any other info required on each page of the site.

Insert a text box into the main content section and type the © notice into it. Drag this box down the page to make it as long as you want. Try not to make the pages too long so that there isn’t much scrolling required.

I start with the Black template out of habit but I could just as easily use the “White” one. It doesn’t really matter which if you are not using the default navigation or the slideshow.

Ok, so you don’t like black or maybe you hate it! You can change the color in the “Page” inspector or choose “Gradient Fill” and use two colors and have some fun spinning them about with the “Angle” wheel.

Obviously, I have set my “Browser Background” color to black as well.

If you have both browser and page background the same color, set the browser background and then choose "None" for the page background.

Once I have got the basic page I click its name in the sidebar and duplicate it a few times - Command D.

Start a new site called "Template" and drag a copy of the basic page down to it so that you can duplicate this and drag it up to the top site any time you need a new page.

Now is the time to ask yourself the BIG question. How many pages do you think you are going to have on your website? What am I going to put on these pages? How can I organize these pages into some sort of logical order?

This is the subtle art of forward planning but, as we all know, the future always contains lots of surprises and twists and turns. The best you can hope to do is make your basic website layout versatile enough to adapt to all those zillions of ideas you are going to think up tomorrow!

TIP: To move text boxes and objects from one layout area to another - header, body, footer - hold down the commend key while dragging.

This is the copyright notice box. This should be on every page of your website. The © is created by holding down the Option key and typing the letter g.

Creating a Page "Template"

Find out more about adding custom features to a website...