Website design -- HTML 5 Navigation Bar

General Technology Description/Standards

  • 1. Demonstrate knowledge of Printing and Print processes.
  • 1a. Understand how to make a rubber or foam stamp and print multiple copies.
  • 1a. Understand how to make a woodcut and print multiple copies.
  • 1b. Understand and make a two colored woodcut or Linoleum print.
  • 1c. Understand and make silk screen prints.
  • 1d. Understand Offset printing.

  • 2. Demonstrate knowledge and skills in Electronic Publishing and Website design.
  • 2a. Understand and use HTML code to create a basic website.
  • 2b. Learn and use Adobe Illustrator to create and edit images for a website
  • 2c. Learn and use Adobe Photoshop to produce graphics for a website
  • 2d. Learn and use advanced Web coding techniques including CSS, PHP and Javascript
  • 2e. Upload and publish a website

  • 3. Demonstrate knowledge and skills in robotics programming.
  • 3a. Follow instructions to build multiple robots out of Lego.
  • 3b. Program robots to do specific tasks.
  • 3c. Design and create original robots and program them.

  • 4. Demonstrate knowledge and skills of injection molding.
  • 4a. Properly prepare molds and parts for injection molding.
  • 4b. Reproduce objects using an injection mold machine.
  • 4c. Create original molds for injection molded reproductions.

  • 4. Understand 3-D CAD and sculpting software
  • 4a. Understand the vocabulary of 3-D software and printing.
  • 4b. Understand and use CAD software to create virtual 3-D objects.
  • 4c. Understand and use sculpting software to create virtual 3-D sculptures.
  • 4d. Understand and use an SLA 3-D printer to make computer generated virtual objects real.

  • 5. Understand and use metal fabrication machines.
  • 5a. Understand software to create pieces for Plasma cutting..
  • 5b. Use PlasmaCam to cut parts to be welded into a 3-d object.
  • 5c. Use Metal Lathe to create prototype parts.
  • 5c. Use Arc, Wirefeed and Gas welders.

  • 6. Demonstrate knowledge and skills in wood working.
  • 6a. Understand safety precautions for wood tools and equipment.
  • 6b. Safely and Accurately make wood projects.

    • HTML 6 Navigation Bar

    The teacher leads the students in making a navigation bar at the top of their website.

    Students are shown the W3school's Nav Bar tutorial and asked to use any of the information presented there to create a 4-page website for a business or something they're interested in.

    Website must include the following:
  • Externally referenced Style Sheet (CSS page)
  • 4 pages (minimum) including Home page that look similar
  • Working navigation bar included on each page
  • One image (or more) on each page
  • Images sized appropriately and aligned (if more than one used)
  • Blockquote used somewhere
  • Image or color background
  • Informative or amusing text
  • Descriptive title
  • "Back to Top" anchor
  • Size and/or color specified Horizontal Rule


    • Evaluation:
    3 points -- Includes all required components listed above
    2 points -- Image quality
    3 points -- User-friendly (All parts work well, including nav bar)
    2 points -- Entire website looks professional

    10 points total



    David's example

    Back to top