Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Stylesheets in iWeb Pages
Now let’s move on to the rest of an iWeb page. iWeb pages are style-heavy: every element that you create is contained within its own <div> tags, each of which is loaded with style information. Given this, you might expect the stylesheet files that are generated with each page to be very complex. They are actually extremely basic and simple. Each Cascading Style Sheet (CSS) file contains only the elements of the original template’s theme. They contain information about each of the text and text boxes that are part of the initial template, along with information about the navigation bar background, the default shape boxes—and that’s it.
These stylesheets are so simple because any time you make a change that takes the page’s design away from the template (changing the color or size of text, for example), iWeb simply adds that style information to the <div> tag for the selected element. If you change only part of one of the initial elements, iWeb creates a new set of <div> tags to enclose that piece of the element, be it an image, a piece of text, or something else. Although it makes sense from the perspective of the iWeb application, looking at the code of an iWeb page can be a bit daunting and the code is nowhere near as clean and designer-friendly as a page created by a human being.
Finding specific items on a page can be made more difficult because iWeb uses the style information to designate the position of each element on a page. Although it’s a logical approach to laying out the page and giving you a solid WYSIWYG design tool, items on a page are not always placed in consecutive order in the code of that page (that is, an item at the upper-left of the page could be near the bottom of the code for that page).
Using a Web design tool or text editor’s search feature can help locate specific images or pieces of text. iWeb usually uses the original name of the image from your iPhoto library or the image’s filename, provided that you didn’t copy and paste the image onto a page (although iWeb often converts images into PNG files regardless of their original format). Text (particularly formatted text) in large sizes or in an unusual font might not be helpful because iWeb often saves text (especially that intended as a title or heading) as an image file—typically with a name like shapeimage_1.png (which it also uses for lines and other generic shapes).
After you find an item on a page, you can work it in the same ways that you would work with any other Web page. You can strip out some of the code that iWeb puts in, modify it in ways that iWeb doesn’t allow you to do, delete it, or replace it with something completely different. Always remember that if you ever republish the site using iWeb, your changes are overwritten unless you specify an alternate location to publish.