While not many will agree with iWeb,09 being the web-builder of choice, it has nonetheless some of the best tools to get even the most complex of web graphics done.

While using Photoshop could seem viable, the ease with which iWeb gets the job done is unparalleled. It is the perfect software when it comes to placing images in odd shapes such as speech bubbles or square with rounded corners.

Just get the graphic made in iWeb and publish it on your hard drive. When you want to publish it, simply copy the graphic from of the site folder and you are done.

Let’s have a look at how to get the entire process done.


Preparing a site

Creating a site in iWeb 09 is extremely easy. Launch iWeb 09 and move to the File menu. Select New Site.

You will be taken to a prompt which asks you for a template. Click on White and double click Blank. We do this to keep it simple. If you want more details and colours, you may pick from the templates.

Once done, you will see a new entry towards the left called Site. This entry will have single page called Blank. Click on Site to open settings for site publishing. The default settings will publish the site to MobileMe however change it for this task. Click on ‘Publish’ and browse down the location you want to save the site at. For convenience, keep desktop the location and name your new folder as “iWeb graphics” or anything simpler. Once done, click on the blank page that lies in the sidebar. This will return you to the blank page work area. Now get on with the task of making the graphic.

Preparing the Graphic

Graphic is technically a combination of shapes, pictures and borders. Let’s start with the process of adding borders to the shape being worked on. You will have to use the inspector to insert a border.


• Click on Shapes, which is at the bottom and pick a graphic shape
• Once you see the shape on the work area, use the corner handles to adjust the size you want. Most of the shapes also offer customisability. You can do this by using the blue control points. For example to create a speech bubble from a rounded square, simply drag one rounded vertex to a point that it becomes like an arrow.
• Now select your graphic and move on to Inspector. Do this by using View menu>>Inspector.
• Now move onto Metrics. Here you’ll find controls for graphic’s height and width. Set the exact dimensions for the graphic here. Keep in mind the line weight that you will use for bordering as it will add to the actual dimensions.
• Click open View menu and move onto Show Media to display the media sidebar. Now click on Photos and identify the picture you want to use in the shape. Once you have dragged the picture in the work area, the same shape controls will appear. Use them to edit the size of the image. Click on Edit Mask if you want to reposition the image in the shape. You can also use Metrics inspector to rotate the image.
• Once you have positioned the image, you can try adding borders. Select the shape you want to add a border to and come to the Inspector. Click on Graphics. In the drop down menu, you will see various options. Pick Line and pick the line style from the pop up that follow. Then pick the line colour and width.

Now lets move on to how to publish the site to the folder and pick the graphic from it.

Publishing and collecting

Click on Publish Site.

Move to the Finder and navigate to the ‘iWeb graphics’ folder. Inside it you will find the Site folder. Open It to find the folder ‘Blank_files’.

It is inside this folder that you will find your graphic. Simply double click on it to preview it or copy it to a location you want. You can change the name as well for better retention.