Creating Online Portfolios

Day 1 -

• Intro to the Web
• HTML
• Web Servers
• Files
• Store and edit locally
• Upload to server
• Websites and 24/7 global access
• Personal web sites at ASU
• Web Hosting companies
• Password protection
• Editing websites
• HTML
• Dreamweaver
• Word
• Frontpage
• Freeware
• Web 2.0
• Social Networking sites (myspace, facebook, tribe)
• Wikis and Blogs
• Del.icio.us, Digg, etc.
• Flickr, Picasa
• Subscriptions/RSS

Sample files for day one:

Sample MS Word document

Sample Adobe PDF file

Sample HTML file created in MS Word

Sample image:

Day 2

We will offer PFF fellows two options - Continue with Wikis, or learn Dreamweaver

1. Continue working on your wiki page and have your portfolio up to date by the end of class. Content covered will include:
1. Refining your Wiki layout and formatting
2. Images and alignment
3. Links to external resources
4. Tables
5. Variables
6. User management - Co-authoring wiki sites

2. Learn Dreamwever - for the folks who want to immerse themselves in web design and learn the professional tools. This will be an introduction to the tool and participants need to be aware that it will take many hours of work to master Dreamwever and completely customize your website.
1. Site setup and management
2. Dreamweaver toolset
3. Basic page layout and formatting
4. Internal and External links
5. Images and alignment
6. CSS - internal vs. external
7. Resources for more info

Useful links:

Wikis

ASU's Wiki server: http://wiki.asu.edu

Wiki information

• About Wikis: http://en.wikipedia.org/wiki/Main_Page
• Sample page: http://pffdemo.wiki.asu.edu
• Wiki editing:
• http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page
• http://www.mediawiki.org/wiki/Help:Editing_pages

Blogs

ASU's Blog server: http://blog.asu.edu

Blog information

• About Blogs http://en.wikipedia.org/wiki/Blogs
• Blog editing
• http://codex.wordpress.org/WordPress_Lessons

Web pages

Set up Webspace: http://www.asu.edu/asurite

Web development info: http://www.asu.edu/jukebox

Sample website: http://www.public.asu.edu/~aust5481

An excellent HTML tutorial for coders: http://www.mcli.dist.maricopa.edu/tut/

Web 2.0 Tools - (tools we mentioned in the workshop - that are free)

• http://www.flickr.com - Photo site from Yahoo
• http://picasa.google.com - Photo site from Google - includes a free tool to manage and edit images
• http://docs.google.com - Online word processor and spreadsheet that allow for collaborative authoring
• http://del.icio.us - Online bookmarks manager

Freeware Tools:

Free Productivity tools - including PDF creation, Spam protection, Wordprocessors, Spreadsheets, etc.