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

RELATED ASSIGNMENTS in SCHOOLOGY:

• favoriteFood.html (in class)
• favoriteMusic.html (in class)
• recipe.html (homework - apply on your own)

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.

---

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.

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.

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​​

Unit 2: Structure  - Wireframes and Layout

• 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.

SAMPLE of Using 4 Structure Elements within our Basic Template

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)