Re-Vision Project

Back to ENGL 303

Project 3 is a re-vision of your personal website. The project is broken into two intersecting parts. Each part includes a number of steps. Don't worry though, none of the steps are especially time-consuming in themselves! The parts are: 1) Web 2.0 surfing activities; 2) Site re-vision.

1) Web 2.0 surfing activities

del.icio.us

• Join del.icio.us. Follow the directions and install a del.icio.us button on your browser. As you use the web in your daily life, bookmark the pages you visit on the web on your del.icio.us account. Bookmark your familiar or favorite sites, as well as any new pages you visit - create a set of bookmarks of all the pages that interest you.
• Tag the pages as well, using whatever tags you want.
• Add a del.icio.us tag cloud to your website. Cut and paste the following code into your web page source, changing sbaldwin to your del.icio.us user name:

       <script type="text/javascript" src="http://del.icio.us/feeds/js/tags/sbaldwin?count=50;size=12-35;color=990033-990000"></script>
  

• Finally, add a del.icio.us feed to your home page. Cut and paste the following code into your web page source, changing sbaldwin to your del.icio.us user name:

       <script type="text/javascript" src="http://del.icio.us/feeds/js/sbaldwin?count=5;title=my%20del.icio.us;icon"></script>
  <noscript><a href="http://del.icio.us/sbaldwin">my del.icio.us</a></noscript> 
  

Google

• Submit your website to google. Follow the direction here.
• Add a google search to your website. Follow the directions here create a search engine Note: you will need to create a google account if you do not already have one (or a gmail account); this is free and easy.
• Optional! If you want to add a google map to your site (as on Sandy's page), follow the directions here.

Blogger

• Create a blog following the directions here. You'll need to use your google account.
• Post at least ten times to the blog by the Project 3 due date. You can post more often if you want, of course! Post about anything you want and for as long or as little as you want.
• Post a link to your blog on your web page.

2) Site Re-Vision

The first project asked you to create a website based on a familiar object or space. You were asked to adapt this object or space as the organizing principle or metaphor for your project. You were asked to make your website be this object or space. For the site re-vision, return to that object or space to re-vision your entire web site. First, save a copy of the original first project. Second, use the pages from the first project as the template for your overall site, i.e. re-think your home page as a multi-page site organized and imaged in terms of that familiar object or space. For example, if the first project was focused on your car, then use the parts and images and stories associated with your car to structure your site. (Your car will be your site.)

• Look at CSS Zengarden to get a sense of sites with a unified look/feel.
• Refer back to Project 1 for recommendations on how to approach the site and for links to similar sites from previous semesters. (Again, keep in mind that the assignments was different in those previous cases.)
• In elaborating on your object or space, consider images, metaphors, processes, patterns, words, stories (and so on) that you associated with it. This is your personal homepage, so part of the goal is to situate yourself in the site. Make it your own!

Pages and text

The re-visioned site should include a minimum of 8 pages, i.e. 3 more than the minimum for the first project. Your homepage or index.html will still include links to your projects 1 & 2, but that page - as well as all the others - must be re-visioned. The site should include a minimum of 1000 words of writing emerging from the guiding object or space. Remember the principles of "scannable" web writing: 1) highlighted keywords (hypertext links serve as one form of highlighting; typeface variations and color are others); 2) meaningful sub-headings (not "clever" ones); 3) bulleted lists; 4) one idea per paragraph (users will skip over any additional ideas if they are not caught by the first few words in the paragraph); 5) the inverted pyramid style, starting with the conclusion; 6) half the word count (or less) than conventional writing (linking replaces large blocks of text).

Images

Incorporate at least ten significant images that you create into your re-visioned site. These can be distributed among the pages. These images are not background but must participate in the overall mood or design of the site. Also, you must use CSS styling on your site, either in your pages or in a separate stylesheet. This includes creating background(s) for your site (it can be color and/or imagery).

FAQ and Map

Create a site FAQ ("frequently asked questions"). Include this on one of the pages and link it to your homepage. Also, create a sitemap. You can draw it by hand or in a program like Photoshop. Include the sitemap as an image on the FAQ page. (The sitemap/FAQ page counts as one of your 8 pages.)

Navigation

Use at least two forms of navigation in your re-visioned site. Navigation includes: links within text, links on photos, menus, breadcrumbs, etc. As far as possible, links on your site should be on content (image, text) and not simply through a "click here" button. Links should add to the meaning of the project.

Significant Dates

Mar 13 Discuss website look. Read Tidwell Chapt 9 (scan 7 & 8). Intro to Dreamweaver.

Mar 15 Discuss mood or theme in websites using "wabi-sabi."

Mar 20 Backgrounds.

Mar 22 Animation/FAQs.

Apr 3 Intro to Project 4.

Apr 5 Workshop in class

Apr 10 Discuss flickr. Discuss Public Space Projects.

Apr 12 Project 3 due by 6pm