HTML Lecture by Dave Gray

Jul 7, 2024

HTML Lecture by Dave Gray

Opening Remarks

  • Instructor: Dave Gray
  • Duration: 4 hours, comprising 10 tutorials
  • Resource Links: Available in the video description and compiled on GitHub
  • Acknowledgements: Thanks to Bo and FreeCodeCamp

Chapter 1: Introduction to HTML

HTML Basics

  • Acronym: Hypertext Markup Language
  • Purpose: Defines meaning and structure of web content
  • Hypertext: Links connecting web pages
    • Can be within the same site or across different sites
  • Usage: Annotate text, images, and other content for display in web browsers

Getting Started Tools

  • Web Browser: Recommended - Google Chrome, downloadable at google.com/chrome
  • Code Editor: Recommended - Visual Studio Code, downloadable at code.visualstudio.com
    • Extensions: Dark New Tab, Prettier, VS Code Icons, GitHub Theme, Live Server

Setting Up the Environment

  1. Download and Install Visual Studio Code
  2. Create a Folder for HTML Course
    • Example: HTML_course/01_lesson
  3. Open Visual Studio Code and Select Folder
  4. Create a New File Named index.html
  5. Basic HTML Structure
    • HTML tags: <html></html>
    • Head section: <head></head>
    • Body section: <body></body>

HTML Page Structure

Elements and Tags: Basic Syntax

  • HTML Element: <html></html>
    • Opening Tag: <html>
    • Closing Tag: </html>
  • Head and Body
    • Head Element: Contains metadata
    • Body Element: Contains content visible in the browser
  • Title Element: <title>My First Web Page</title>
  • Save: Ctrl + S

Using Prettier Extension for Formatting

  • Installation: Search for