Academics Athletics Alumni Faculty Guidance Information News Student Life

  Mr. Mitchell: Web 1  

Week of March 10-14 - Building a Webpage in Fireworks

1 - Recreate http://www.vw.com using Fireworks and rollovers

Week of March 3-7 - Learning the Basics of Fireworks

Practicing Fireworks

1. Swap the heads from one image of a person/animal onto another
You must use these tools in Fireworks: lasso, magic wand, blur/smudge
2. Cut out the background of a school bus image
3 - Make an animorph

Week of February 25-29

Learning Fireworks

  1. Fireworks Quiz
  2. Recreating pg. 115 as Brave Bank

Week of February 19-22

Learning Fireworks

  1. Book - pgs 20-50
  2. pgs 56-66
  3. pgs 70-85

Week of February 11-15

Boone Crew Redesign

Design Features

Make the width 990 pixels wide
We can keep the current banner if you choose
Top navigation is preferred - but a side is optional
Use an image for a rollover effect - similar to www.edgewatercrew.org uses the oars
Current Events on the home page will contain the latest news
Name and address going across the bottom of the page

Links

Team Schedule- that would have practice and regatta info without the big calendar
Crew News & Info- test dates, pasta dinner dates, team values, fundraising info, merchandise info
Photos
Facilities- boat house, spring training- directions- link to Turkey Lake Park
Hood Cup-info and forms
Admistration-board/coach info
Programs- summer rowing/Junior Boone Crew
Is Boone Crew For You-with link to flyer and all registration forms

Deadlines

Layout plan - Tuesday

Week of February 4-8

Div Tags (use www.tizag.com)

1 - What are div tags
2 - What are the 5 attributes you can use
3 - Explain what div ids are
4 - What code would make a div id:

Center, Font Arial, Size 14x, Background black

5 - What code would specify coordinates in a div id

Week of January 22-25

Frames

Week of January 7-11

Web 1 Mid Term Study Guide

Multiple Choice Section

  1. What is a browser used for?
  2. What does a hierarchical Web site structure mean?
  3. What does the W3C do?
  4. What does WWW stand for, and what is the word internet short for?
  5. What does a WYSIWYG program do?
  6. Once a web page is published, what can anyone do to it?
  7. What things can be a hyperlink?
  8. What are some things you should do to test a website?
  9. What do most HTML tags consist of?
  10. What is an ISP?
  11. What is an intranet?
  12. What is web server used for?
  13. Name three web browsers.
  14. What programs can you use to create web pages?
  15. What is the symbol to close a tag?
  16. What is the code to make something bold, italic, or underlined?
  17. What should you name your home page?
  18. What is the code to make something a link to an email address?
  19. How can copying and pasting be useful when creating web sites?
  20. How can you control borders around a table?
  21. Explain how colors are incorporated into good web design.
  22. What is the difference between a link and an anchor?
  23. What is the difference between the body and td tags?
  24. How could you center your entire web page?
  25. When would you want a background image versus a background table?

Practical Section

  1. Creating a table with multiple columns and rows
  2. Aligning left, center, and right in the body and td tags, as well as an entire table
  3. Creating hyperlinks
  4. Inserting images
  5. Naming of files and folders
  6. Importing and editing a CSS

Weeks of December 10-21

You will create a project that includes:

wish list,
greeting/holiday card
submission form
music playlist

You will need to design your home page, create a nav bar, use a CSS, and find any codes you need.

Create a new folder directly on your h drive called december, and save all work there.

Week of December 3 - 7

1 - Building CSS
2 - Controlling the look of a page with CSS
3 - Attaching a style sheet
4 - Recreating pages using CSS

Week of November 26-30

  • How to create an external CSS

Assignment
Create a single page report in Dreamweaver that has the following 5 headings:

  • HTML Basics
  • Managing Files and Folders
  • Getting Started in Dreamweaver
  • Creating Tables
  • Creating a CSS

You must use an external CSS to define the styles for your title, subtitle, body, and references.  Save the page as report.html in your CSS website.

Week of November 5-9 and 12-16

Career Website Project - Create a website about a career of your choice. Requirements:

Page Requirements:

  • Your pages will be Home - must include your navigation bar, career choice,an image with a border, background color/image
  • Education - information about the high school courses you could be taking, as well as college major and prospective schools
  • Salary - must include starting salary, average salary, and maximum salary (within reason)
  • Advancement - what will be your job title at entry-level, as well as what could you progress to
  • Duties - describe your job duties and/or a typical work day
  • Location - where would you work geographically, as well as list 5 prospective employers
  • Links - list the websites where you found your information - must have at least 3 - these must also be hyperlinks to the site

Site Requirements:

  • find/create buttons for your navigation bar - the buttons must be images, not links through a website
  • include a font style CSS applied to all pages
  • include a title applied to all pages
  • apply margins of 0, 0, 0, 0
  • all information must be inside of a table that is centered on your page
  • Education and Location pages must include tables for your information - one table must have text centered horizontally, and vertical alignment top, and a table background color different from the page background
  • include an image on each page that represents the page title
  • include a heading on each page, or another appropriate way to let the user know what page they are on
  • include a mailto link to an email address
  • bottom of the site must have text that indicates: Copyright 2007, All Rights Reserved, Your Name
  • some text must be underlined with both double and single spacing between lines

Week of October 29-November 2

1 - Web Research

1-Find 2 free email providers (not yahoo, google, aol, or hotmail)
2-Name 3 website hosting companies
3-Find 2 webistes to search for someone's phone number and address
4-What is the address of the nearest Saab dealership
5-What is the URL of the Orlando convention center
6-Use this website to find the dates of the Central Florida International Auto Show, and what concourse will it be on
7-Find 3 websites to download free Photoshop brushes
8-Names 3 websites to find HTML scripts
9-What is the URL to download a plug-in to convert Microsoft Works to Word, and Word 2007 to Word 2003
10-Find a free WMA to MP3 converter program

2 - Recreating pages 234-6 using tables in Dreamweaver

Week of October 22-25

1 - Hand-coding for tables
Retype this code in code-view in Dreamweaver:

<body>
<table width="420" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>Column 1 </td>
<td>Column 2 </td>
<td>Column 3 </td>
</tr>
<tr>
<td>test 1 </td>
<td>test 2 </td>
<td>test 3 </td>
</tr>
<tr>
<td>test 4 </td>
<td>test 5 </td>
<td>test 6 </td>
</tr>
</table>
</body>
</html>

2 - Redesigning in Dreamweaver
3 - Merging cells
4 - Find the code for these:

1 Table border of 3 pixels
2 - Table border of brown
3 - Table frame below
4 - Cell spacing of 5 pixels
5 - cell padding of 0 pixels
6 - Table width of 100%
7 - Spacing of 3 columns
8 - Aligning text in a table verticle
9 - Centering an entire table
10 - Font size of 70%
11 - Background color black
12 - Background image race.jpg

Week of October 15-18

1 - Code for tables
2 - Redesigning sites using Dreamweaver

Week of October 8-12

Case 1
1 - From your tutorial.03/case1 folder - remove the 'txt' from the file names
2 - On the index.htm page - make the image size be twice as big
3 - Choose a nicer font style for the text on all the pages
4 - Create a navigation bar to go at the top of each page, and make all the links work
5 - Use menu.gif as the left navigation bar aligned left and create rectangular hotspots to link the appropriate pages. (See pg. 164 # 4 & #9)

Case 2
1 - From your tutorial.03/case2 folder - remove the 'txt' from the file names
2 - Change the background color to black or 000000
3 - Change the font color so you can read it easily
4 - Set the left margin of the king.htm page to 60 pixels
5 - Choose a different heading style and center it
6 - Change the color of the horizontal line at the bottom of the page
7 - Add the phrase Free at last! Free at last! Thank God Almighty, we are free at last! as the last line of the text and use a heading style.

Case 3
1 - From your tutorial.03/case3 folder - remove the 'txt' from the file names
2 - Set the background color to black and the text to white
3 - Use the image back1.gif as the background image
4 - Set the right margin to 10 and the left margin to 100
5 - Make the title and the heading stand out more
6 - Add circular hotspots onto the locks.jpg image as directed in step 10 on page 169 - but make all pages link back to crypt.htm

Next
Open up all three cases in Dreamweaver and enhance each site using the help of Dreamweaver - make sure you explore and try out as much as you can

Week of October 1-5

1 - Complete Amusement Park website from the book pages 109-158

2 - Redesign this website with your own images and color scheme

Week of September 24-28

1 - Complete your website to consist of 5 pages with a navagation bar on each page linking to all pages.

2 - Define terms: _blank, _target, _self, semantics, spam, directory, anchors, pop-up message

3 - Insert a pop-up message, anchor, and _blank on your page

4 - Open data files and begin Chapter 3

Week of September 17-21

1 - Make a webpage about your favorite team, artist, etc. Your page must be 5 pages total (including your home page, which must be saved as index in a separate folder for this website)

2 - Insert anchors, hyperlinks to new pages, background image, and a basic CSS onto your web page

Due date: Tuesday, September 25

Use this code as a sample:

<html>
body {
background-image: url(Team3D.png);
background-repeat: no-repeat;
background-color: #CCCCCC;
margin-top: 300px;
}
body,td,th {
font-size: 12px;
color: #666666;
}
-->
</style></head>
<body>
<p><a href="#bio">Bio</a> :: <a href="#movies">Movies</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a name="bio" id="bio"></a>Bio</p>
<p><a href="http://www.yahoo.com" target="_blank">Link to outside site</a> </p>
<p>Bio goes here. </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a name="movies" id="movies"></a>Movies</p>
<p>Movies go here. </p>
<p>&nbsp;</p>
</body>
</html>

Week of September 10-14

1 - Use Notepad and make a web page of images you find related to a theme you choose.

2 - Case Problems 1-3 pgs. 46-51

Week of September 4-7

1 - Complete website about yourself

2 - Make an HTML cheat-sheet page for coding

3 - Make Mr. Dube's Chemistry website on pages 41-42 in text

4 - Go to www.htmlgoodies.com/primers/html and complete all of the Basic HTML lessons (Introduction - Graduation) and answer 15 questions below.

Using Microsoft Word, answer these questions in your own words and save the document as "basic html" in your Web Design folder:

1 - What is a web browser, and name two

2 - What is the very first tag that tells the browser that it's reading HTML?

3 - Will your tags appear on your web page?

4 - Can you use two tags at once?

5 - What is the tag to make a horizontal reference?

6 - What is the CSS tag to make your font small and red?

7 - What is the tag to center text?

8 - What would be the tag to create a link that sends an email to Mr. Mitchell at mitchej1@ocps.net?

9 - What are these file formats used for: .gif, .jpg, .png, .bmp?

10 - What is the code to insert an image called computer.jpg that when clicked, brings you to a page called mycomputer.html?

11 - What is the code to insert an image called work.gif centered on your page?

12 - What does "floating" an image do?

13 - Can you use HTML to resize an image, or do you have to resize the image manually using a graphics program?

14 - What does it mean when an image is "pixelly" or "pixelated"?

15 - What is an advantage and a disadvantage of using a free website hosting site?

BONUS: What tag did I use to make this numbered list, and what else could I have done?



 
Boone Students Today, Brave Leaders Tomorrow!
ACADEMICS :: ATHLETICS :: ALUMNI :: FACULTY :: GUIDANCE :: INFORMATION :: NEWS :: STUDENT LIFE