Web Page/Dreamweaver/Project 3

From Wikiversity
Jump to navigation Jump to search

Dreamweaver Future Project[edit]

In this project, you'll imagine where you'll be and what you'll be doing 10 years down the road - if everything goes exactly your way, or better. Then you'll share your dreams with your classmates through a Web site you create all about you.

Step One: Create the Layout Tables[edit]

1. In Dreamweaver, click the Layout tab and switch to Layout View ( more on Layout View)

2. Create a Layout Table that is 650 x 700.

3. Proceed to draw the following layout cells:

Future1.gif

4. Save this file as page1.html

5. Create a new document in DW.

6. Create a Layout Table that is 650 x 500.

7. Proceed to draw the following layout cells:

Future2.gif

8. Save this file as page2.html.

9. Go to File>Save As and save this file again as page3.html.

10. Repeat step 9 two additional times, saving the file as page4.html and page5.html.


Step Two: Add Text[edit]

1. Page One: Consider your ideal future, ten years from now. In the appropriate cell on your page, (see below) write answers to the following questions. Don’t skimp on the detail. Assume a best-case future – the way you want it to be.

Future3.gif

Lifestyle What career do you see yourself in? (Will you be an entrepreneur? A music or movie star? A politician? A sports hero? A scientist? A teacher? How will you get there?) What kind of lifestyle you will have?

Location Where you are living and how you ended up there

Goals and Accomplishments achievements, professional or otherwise, you are most proud of, and goals yet to achieve

Favorites Whatever your personal preferences and interests are likely to be in ten years What car will you drive or cool techno-toys will you own? What will your favorite hangouts and friends be like? Where you will travel, what you will wear, what sports you will play, what musical instruments you will make, what art will you collect?


2. Page 2: Details, details, details. Key the questions and your responses in the appropriate cells.

Future4.gif

The questions are:

My typical day at work is like...
I was able to get my dream job because I...
My favorite thing about my career is...
I would use these adjectives to describe my career...
I have only one regret about my lifestyle, it is...


3. Page 3: Just like page 2, key the questions and your responses in the appropriate cells.

The questions are:

Why I chose to live here...
Other cities/countries I have lived in...
My favorite thing about this place is...
My house is like...
I live with...


4. Page 4: Just like pages 2 and 3, key the questions and your responses in the appropriate cells.

The questions are:

My proudest moment was when...
I had this goal in high school, but I didn’t achieve it...
I had this goal in high school, and I did achieve it...
A goal I have yet to reach is...
I ten more years I see myself...


5. Page 5: Just like pages 2, 3 and 4, key the questions and your responses in the appropriate cells.

The questions are:

My favorite vacation was...
I’d say my fashion style is like this now...
I really like to listen to this kind of music...
My favorite techno-gadget I have is...
I am still friends with ____ from high school...


Step Three: Adjust Page Properties[edit]

On each of your pages you will want to choose a color scheme to reflect yourself and your future. For the example project, I chose black and gray.

Adjust the background color:

1. Go to Modify > Page Properties

Future5.gif

2. In the dialog box that opens, choose "Background Color" and select a commonly used background color. Otherwise, you could key in a hexadecimal color code. Click Ok.

Future6.gif


Adjust the text color:

1. Go to Modify > Page Properties

Future5.gif

2. In the dialog box that opens, choose "Text Color" and select a commonly used color. Otherwise, you could key in a hexadecimal color code. Click Ok.

Future7.gif


Step Four: Create Images for Page One[edit]

You'll need 6 images for page one that you will create using Fireworks.

Header Image: The header image is the rectangular image that will appear at the top of the page.

1. Determine the size of your layout cell by looking back at Step One. (hint: the size is listed on the very first image on this page)

2. Open Fireworks and create a new document. Your size should be 650 x 60 and choose a canvas color that matches the background color of your pages.

Future8.gif

3. Use your text tool to type "Future Me: Where I'll be in 10 years" (more on using the text tool)

4. Use Effects to add a shadow or glow to your text. (more on using Effects)

5. Use the Shape tools to add background elements as shown below:

Future9.gif

6. Save this file as header.png.


Center Image: The center image is the square image that will appear in the center of the page.

1.