# Week 2: Getting into HTML, CSS, and Git

# Setting Up Your Environment

• Create Directory structure for class notes and work.
• These are all the web technology related classes.

• Documents/
  • code/
    • mad9013/
      • assignments/
      • week-2/
      • week-3/
    • mad9014/
      • assignments/
      • week-2/
      • week-3/
    • mad9124/
      • assignments/
      • week-2/
      • week-3/
    • mad9022/
      • assignments/
      • week-2/
      • week-3/
    • mad9135/
      • assignments/
      • week-2/
      • week-3/

• Discussion on Best Practices for paths and filenames.
• List of guidelines for MAD&D work.

# Practice Productive HTML (in class)

• Create a basic HTML page structure and save in index.html
• Create an img folder, download and save an image in that folder.
• Make the downloaded images appear on your page.
• Experiment with heading and paragraph tags.
• Add a style element and apply colour and font-family to elements.
• CSS Colours
• Move styles to an external CSS file and link them.
• Displaying dates and times
• Creating Lists

# GitHub

• Learning about GitHub and Practicing using it.
• more Details

# GitHub Pages

• Free static hosting for websites through GitHub.
• Go to settings page and choose between master branch or create a new gh-pages branch and select it as the source.
• Open the GitHub pages version of the content by navigating to the username.github.io domain.
• More Detailed Instructions

# HTML Validation

• HTML is a specific list of tags that you are allowed to use.
• Tags have specific attributes that they are allowed to include.
• Some tags are only allowed to have certain tags as children and other tags are only allowed to be inside specific ones.
• More Details about VALID HTML

# GitHub Exercise 1. (GitHub)

• Complete Exercise 1 and submit both URLs on BS LMS.
• Link to Exercise 1 description

# What to do Before Week 3

• If you are every looking for any videos, here is:
• The full playlist for everything GitHub
• The full Git playlist
• The full HTML playlist
• The full CSS playlist