Website design for the rest of us……

Debra D’Andrea

School Library Media and Technology Specialist

Dandreamedia@gmail.com

If you want me to call you,

send an email with your number

www.dandreamedia.com

www.dandreamedia.wordpress.com

Norman Rockwell

QuickTime™ and a decompressor

are needed to see this picture.

Using

iWEB to create and publish a personal website

QuickTime™ and a decompressor

are needed to see this picture.

iLife Suite

Mac / Apple Only

How did we get here?

Early Website Design…. Was a little scary if you weren’t a math program geek…

QuickTime™ and a decompressor

are needed to see this picture.

Don’t want to learn a new language? HTML definedhttp://www.tizag.com/htmlT

CSS definedhttp://en.wikipedia.org/wiki/Cascading_Style_Sheets

Why WYSIWYG?WYSIWYG (play /ˈwɪziwɪɡ/ wiz-ee-wig)

is an acronym for What You See Is What You Get. The term is used in computing to describe a system in which content displayed during editing appears very similar to the final

output,[2] which might be a printed document, web page, or slide presentation.

Source: Wikipedia

QuickTime™ and a decompressor

are needed to see this picture.

Variety of Programs Available to Do the Job

Common Applications You’ve Heard Of

Best of the Web 2011http://webdesign.about.com/od/windowshtmleditors/tp/windows-wysiwyg-editors.htm

Adobe Dreamweaver Industry Standard / Difficult to learn

MicroSoft Front Page No longer supported by Microsoft

www.bloomfield.k12.nj.us 1. It causes massive errors on other browsers 2. It's not valid code 3. The interface is ugly 4. It's only compatible with Internet Explorer 5. Created weird errors that made problems for visitors, esp. w/o IE 6. Created errors that were not fixable by even the experts here 7. The server that you want to host the site on has to have FrontPage Extensions enabled and updated regularly in order for FrontP ageto work properly

Microsoft ExpressionsExamples: http://webdesigneraid.com/15-brilliant-examples-of-websites-using-expression-engine/Information: http://www.brighthub.com/computing/windows-platform/articles/2949.aspx

Consumer Suggestions

Coffee Cup User Friendlyhttp://www.coffeecup.com

Wordpress blog in place of a websitewww.wordpress.com

QuickTime™ and a decompressor

are needed to see this picture.

QuickTime™ and a decompressor

are needed to see this picture.

eBlogger/blogspot

Google Sites

QuickTime™ and a decompressor

are needed to see this picture.

QuickTime™ and a decompressor

are needed to see this picture.

Google

The Basic Components Before iWEB

Domain NameNoun: A series of alphanumeric strings separated by periods, such as www.oup-usa.org, serving as an address for a computer network connection and identifying the owner of the address

Ie .com .edu .gov

Domain Registration/HostingA variety of hosting options. Do your research, price conscience if necessary, review support. I use GoDaddy. Great phone support all the time.

http://www.hosting-review.com/?gclid=CIav88Gg0akCFYLc4AodqDaYMQ

Site HostingApple Hosting

http://www.macworld.com/article/160728/2011/06/apple_mobile_me_transition_faq.html

Outside Host

http://www.godaddy.com/hosting/web-hosting.aspx

QuickTime™ and a decompressor

are needed to see this picture.

Onto the Program iWeb

Open Program

Let’s Review the Menu, Buttons, Features and Icons

Create New Site

Choose Template

Choose Page Style

Organization

Adding Pages

Changing Names

Menu

Directory

All Text, Photos and Layout Can Be Altered

They appear as place holders. Photos fill the frames instantly.

Text appears at the fonts/sizes you see but this can be changed

Insert Media Button

Links to:

iPhoto

iTunes

iMovies

Drag and Drop

Be careful of bandwidth. Consider service contract and amount of time to

load

Inspector•Create Hyperlink

•Link To Pages

•Link To Photos

Uncheck

Make Hyperlinks active when working

makes format buggy

Don’t forget to re-activate!

Ready, set…. PUBLISH!

Debra D’Andreadandreamedia@gmail.com973-632-4320www.dandreamedia.wordpress.com

Site SamplesPhotography Sitewww.dandreamedia.comMusician Sitewww.larissadandrea.comMedia Center Sitehttp://www.ehow.com/videos-on_21_design-website-using-iweb.html

Video TutorialseHOWhttp://www.ehow.com/videos-on_21_design-website-using-iweb.htmlLYNDA.Comwww.lynda.com

ResourcesTemplateshttp://www.iwebtemplate.com/

Winning iWeb WEBSITEShttp://iwebusersites.com/Home.html

RESOURCE PAGE

QuickTime™ and a decompressor

are needed to see this picture.