Announcements +
the occasional rant

Reading about Links for Thursday, Oct. 25

Posted on: October 22nd, 2012
For Thursday, some reading in Learning Web Design:

  • Review pages 105 – 111 in Chapter 6: Adding Links
  • Read pages 112 – 120 in Chapter 6: Adding Links

After we’ve finished the crit on our Artist/Musician site, we’ll do an in-class exercise based on this reading.

Enjoy your day off – see you Thursday!

No Comments »

How to create a webpage – with rollovers! – using Photoshop & Dreamweaver

Posted on: October 16th, 2012

Thursday we learned about creating multiple optimized images from one Photoshop webpage comp.

Today, we’ll review those steps and take it further. We’ll use Photoshop to slice and optimize the comp images (that’s the review part).

We’ll also use Photoshop to actually create our html page! When the page and all the images are created, we’ll open it up in Dreamweaver and make our Javascript rollovers.

Step-by-step directions below:

Slicing+rollovers from Ann Foley
No Comments »

Busy Week! (Week 7)

Posted on: October 11th, 2012

Busy week!

We started work on the artist/musician assignment, which is fun and creative and challenging.

This week, we talked about and worked on these steps of the assignment:

  1. Choose artist and gather images.
  2. Using Photoshop, create a static comp of your artist page.
  3. Slice up the comp into the required areas: titlebar, navi, etc. Slicing, BTW, is a Photoshop term that means cutting up a comp.
  4. Optimize each slice appropriately for the web. We will cover slicing and optimizing thoroughly.
  5. Create a gif animation to put in the little animation div in the lower right-hand corner.
(I’m going to simplify the steps below. We’ll use Photoshop to create slices and to create the html for our pages. Much better!)

Next week, we’ll talk about and work on the following steps:

  1. Open the Artist.html page from the materials folder in TextWrangler. Save it as your Artist webpage. In this html page, place the images you created in the slice/optimize process in their correct divs.
  2. Returning to the navi and back and next slices, we’ll make rollover animations using Photoshop.
  3. We’ll plug the ani, navi, and back/next slices into their areas.
  4. W00T! We’re done! Time for the crit.

No Comments »

Artist/Musician Site

Posted on: October 9th, 2012

Tonight we’ll have a look at our scuba site and plunge right in to the Artist/Musician assignment.

Note that the deadline for the Artist/Musician assignment is now October 25 at the beginning of class.

And here, for your viewing pleasure, Gangnam Style. This video always makes me smile.

No Comments »

September 27 – External Style Sheets & Extended Deadline

Posted on: September 28th, 2012
The due date for the Scuba/100k assignment is extended to Thursday, Oct. 4 at 5:45. We’ll have a crit as soon as they’re all uploaded.

Here’s how you put all your styles into an external style sheet.

  1. Create a document with the extension .css. For example, mystyles.css.
  2. Put that document in the same directory at the same level as the html document you’re working on. In the same folder, in other words.
  3. Copy all the styles from the head portion of your html document. Just the selectors and declarations – not the <style type=”text/css”>…</style> portion.
  4. Paste the styles into the mystyles.css document.
  5. Delete the styles from your html document.
  6. Link  mystyles.css to your html page by putting this in the <head></head> portion of your page:

<link rel="stylesheet" href="mystyles.css">

And there you have it.

No Comments »

Rant Archives

Log in