All Users

 

Are you interested in creating a simple web site to publish your fabulous digital creations, but afraid it might be too complicated?  Fear not! Apple's iWeb software makes it easy. If you don't mind using the professional-looking templates that come loaded with iWeb, check out this tutorial:

 

An online tutorial on creating a web site with iWeb:

 

http://movies.atomiclearning.com/k12/la_gweb_iwmac

 

If you want more detailed information, read on! 

 

Notes for the Siren Web Master

 

The "Take Control of iWeb" guide is located in our resources folder on the network.  Use this guide as you get started with iWeb. 

 

One thing to understand from the outset is that iWeb is a somewhat limited tool.  It is created primarily for beginners and users interested in creating a personal web site with limited content.  Despite its drawbacks, I believe it will serve our needs well enough.  The primary advantage is that unlike the software we have used in the past, iWeb is extremely easy to use.  You need no experience with web design to jump right in and create an impressive web site in a relatively short amount of time.  There are some workarounds that we will have to engineer as we make the software fit the needs of publishing magazine content, but I think this is doable.  No matter what tool we use, there are going to be frustrations.  However, I'm betting on fewer frustrations with iWeb. 

 

Some notes on "Take Control," with page numbers designated at left:

 

16   This is the page to start with if you want to jump right in and start building a site.  If you have no idea how a web site actually works, you might want to check out some of the background info. in earlier pages.  Go ahead and launch iWeb so that you can experiment as you read.

 

Note that "domain" means something very specific in iWeb that is different from the way the term is generally used in the world of the Internet. 

 

You will choose the option of creating a new domain.  Save the domain in the "sites" folder that should already exist in your personal directory on the mac.

 

The next section covers using templates.  To get acquainted with iWeb, go ahead and pick a template and choose the welcome page.  Go through these steps to change the images and text on the welcome page you see.  If you want to start over, you can easily delete your site by highlighting and going to Edit > delete site.  Then go to File > new site to choose a new template and start over.  I recommend choosing templates that don't have rounded edges at the page corners (this makes it difficult to customize the browser background--see below under tips) There is a lot of stuff here that you can quickly skim through; it isn't that hard to change the pictures and text on the welcome page that you are working with.  Note that to use pictures not currently in iPhoto, open the folder with the pictures you want in the Finder.  Drag the  folder to the photos  window in the media browser.   You'll find the folder inside a folder called "folders."  You can drag images from there. 

 

33  Add special elements.  Note that counter only works with a .mac account (we don't have one -- we'll host from the school server instead).  We'll look into inserting one using another method.  The "email me" button is something we might want.

 

34  Change Page Size and Background Color.  Important.  After this, skip to page 45.

 

45  Publish From iWeb.  This is what you will do when you have a site built and we're ready to post to the web.  Don't worry about ftp and the url -- you just need to get it published to the correct folder, which is ~/root folder. (~ designates Siren network area).

You are going to have to do this again each time new content is ready to post.  Every single file gets republished, which is weird and irritating, but Apple developers have their reasons for this, I suppose.

 

47  Work with Text.  Important.  You can try out these tips on the welcome page you were working on, or just open a new page.  File > new page.  Or just click the plus sign in the bottom left corner.  Choose a page type from the options.   Note that rotation, shadowing, or layering applied to text will turn it into an image.  This means that the page will be "bigger" -- take up more memory space.  It will load more slowly for people with slow Internet connections.

 

55 Create Web Hyperlinks.  Very important.  "hyperlink" is not a commonly used word.  "Link" is the more common term.  Links (to both internal and external pages) can be really helpful to readers.  As the web master, you can use your own discretion about turning some text items into links.  For example, if you are publishing an essay on "The Book Thief" and it contains a reference to Dachau, without much explanation, you could make that word into a link to the Wikipedia page on the Dachau concentration camp.  Note that you can't add anchor links.  This is irritating, but we probably won't need them for The Siren pages. 

 

60  Shapes, Layers, and Masks.  Important.  Note how you can make text wrap around a shape.

 

63  Text in shapes.  Could be useful for captions or blurbs.

 

66 Masks.  Helps you display only part of a photo you've added.

 

69  Publish a blog.  This tool may be useful for publishing Siren content.  Each "blog" could actually be a category of text content we publish, like fiction, poetry, or nonfiction.  However, when I tried it, I was bothered that you can't customize the blog homepage so that, for example, dates are removed and replaced by bylines.  Same problem with archives page.  You can add the byline to the first line of text, but then it won't appear in the archive.  You can't delete the archive and create your own.

 

70  Create a podcast section.  Might be useful to use the podcast template for posting audio and video content.  Play around see. Could save some time.  However, we can't use iWeb to submit the podcast to iTunes.  We will need to use gcast for this.  More on that later.  Note that you will not be sending content directly from Garageband or iMovie.  You'll use the other method described. 

 

86  Create a photo page.  You may want to use the photo template only for photo essays.  Or you may not want to use it at all.  It's easy to insert photos without using the photo template.  The advantage of the photo template would be that you can make the photo essay into a slide show.  Note that you won't be exporting from iPhoto.

 

For more on photos, see above sections on masking, photo fill for a shape, shadowing, etc.  You can use a text box to create a caption below a photo.

 

Tips on embedding video:

 

 

 

More tips:

 

Choosing the "blank" option for a template will give you more control over the page.  Notice that if you want a design element like a sidebar but don't want to create it from scratch, you can select a sidebar on another template page and copy it.  Then paste it on your blank page. 

 

Use the page inspector basic controls of a page's features.  Click the layout tab on the page inspector window. One cool way to customize a page is to create a new "browser background."  Leave "image fill" selected and choose a new tile.  You can find some amazing tile images (lots better than what the iWeb templates are using) posted on the web by designers and artists.  Here's a link to some new ones:  http://speckyboy.com/2008/07/31/21-amazing-and-free-texture-backgrounds-collections-for-designers/.  I've downloaded some of these and placed them in ~/resources/design elements.  When you are at a web site with tile images posted, just right click the image and save it to our resources folder.  The page inspector in iWeb will allow you to browse to it.  Note that a template page that has rounded edges will look a little weird when you change the browser background.  Try to stick to template pages with square corners.

 

To create divisions on a page, you can use a line from the selection of shapes.  Use the shape inspector to alter the line as needed.   The numbers that pop up  will help you place the line  on the horizontal axis.   Boxes can also help create divisions.

 

Adding a shadow behind a box or a photo is an easy way to enhance the appeal the layout.

 

Look around at other online magazines as you consider ways to organize our content. 

 

Add tips as you discover