MS. BAUMANN'S WEBSITE
  • Home
  • High School
    • APCSP >
      • Unit1_Digital_Information
    • StudentNews
    • VP Movie - Making a Movie
    • Code >
      • How To's - Quick Reference
    • Web Design >
      • WD:Unit 2
  • Middle School
    • Technology 7 >
      • Game Animation
  • Me/The Classroom
  • EPlans
  • Grading Scale/Expectations
  • Classroom Rules
  • Basics
    • Citation Sites - Bibliography
    • Dictionary & Thesaurus
  • WebFiles Drive-Staff ONLY
  • Tools
  • Movies - iMovie Editing
  • Movies - iMovie Editing Songs
  • Stop Animation
  • parkinglot
  • random
  • HeadsTails
  • Video 1- AI
  • SharedTime
  • HTML
Picture

Introduction to Web Design

​Helpful Website: W3 Schools.    Validator
Unit1   Unit2    Unit3   Unit4    Unit5   Unit6   Unit 7   
Final Project.    Final Exam
Calendar of Work
Unit 2: LISTS -  Unordered and Ordered Lists
Picture
RELATED ASSIGNMENTS in SCHOOLOGY:
  • favoriteFood.html (in class)
  • favoriteMusic.html (in class)
  • recipe.html (homework - apply on your own)
Picture
An unordered list starts with the <ul> tag. Each list item starts with the <li> tag. The list items will be marked with bullets (small black circles) by default. There is NO SPECIFIC order to an unordered list. 


Picture
Picture

​An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The list items will be marked with numbers by default. Used to give SPECIFIC ORDER or PRIORITY to items in the list

Picture
Unit 2: Special Characters
In order to use special symbols and characters, you will need to use specific characters, sometimes called entity characters in your HTML.
Picture
Other tags that may be helpful:
<br>     This will "break" the line.


The HTML <br> element defines a line break. Use <br> if you want a line break (a new line) without starting a new paragraph.
​
RELATED ASSIGNMENTS in SCHOOLOGY:
  • specialCharacters.html (homework)​
Will need to apply some special characters is:
  • casitabandb.html
  • trillium.html​​
Picture
Unit 2: Structure  - Wireframes and Layout
Picture
  • The <header> element - NOT to be confused with a heading, is to contain the headings of either a web pages  or area within the document such as a section or article. This is a BLOCK display element and typically contains one or more heading level elements.
  • The <nav> element is to contain a section of navigation links. The BLOCK display is and
  • The <main> element is to contain the main content of the page. There should only be ONE main element per page.
  • The <footer> element is to contain the footer content of a web page or section. This is at the end of the page.
Picture
Picture
SAMPLE of Using 4 Structure Elements within our Basic Template
Picture
RELATED ASSIGNMENTS in SCHOOLOGY:
  • structure.html (in class)
Will need to apply some special characters is:
  • casitabandb.html (in class)
  • trillium.html (homework - on your own application)

Trailblazers lead the way.
Prepare Students for Life.
| 
Support Every Child.




Copyright 2024

powered by weebly
  • Home
  • High School
    • APCSP >
      • Unit1_Digital_Information
    • StudentNews
    • VP Movie - Making a Movie
    • Code >
      • How To's - Quick Reference
    • Web Design >
      • WD:Unit 2
  • Middle School
    • Technology 7 >
      • Game Animation
  • Me/The Classroom
  • EPlans
  • Grading Scale/Expectations
  • Classroom Rules
  • Basics
    • Citation Sites - Bibliography
    • Dictionary & Thesaurus
  • WebFiles Drive-Staff ONLY
  • Tools
  • Movies - iMovie Editing
  • Movies - iMovie Editing Songs
  • Stop Animation
  • parkinglot
  • random
  • HeadsTails
  • Video 1- AI
  • SharedTime
  • HTML