HTMLHTML16 min read

HTML Layout

Understand how a webpage is structured using header, nav, main, section, and footer.

David Miller
December 5, 2025
3.8k159

HTML layout defines how a webpage is arranged on screen.

  ## Real world example
  Every website has:
  - top header (logo, menu)
  - middle content
  - bottom footer (copyright, links)
  
  ## Basic layout structure
  ```html
  <header>Header</header>
  <nav>Menu</nav>
  <main>
    <section>Main content</section>
  </main>
  <footer>Footer</footer>
  ```
  
  ## UI Preview
  - Header at top
  - Menu below header
  - Content in center
  - Footer at bottom
  
  ## Why layout matters
  Good layout makes website readable and professional.
#HTML#Beginner#Layout