Now, let's move to the next topic:

Web Basics Part:2 - HTML Structure and Core Tags

What HTML Is
• HTML means HyperText Markup Language
• Defines page structure
• Tells the browser what each part is

Basic HTML Structure
• <!DOCTYPE html>: Tells browser this is HTML5
• <html>: Root of the page
• <head>: Meta info, title, CSS links
• <body>: Visible content

Minimal Example
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<!-- content here -->
</body>
</html>

Core Text Tags
• <h1> to <h6>: Headings (use one <h1> per page)
• <p>: Paragraph text
• <span>: Inline text styling
• <strong>: Important text
• <em>: Emphasis text

Links and Media
• <a href="">: Creates links (href holds target URL)
• <img src="" alt="">: Displays images (alt helps SEO and accessibility)

Lists
• <ul>: Unordered list
• <ol>: Ordered list
• <li>: List item

Forms and Inputs
• <form>: Wraps input elements
• <input>: text, email, password, checkbox
• <textarea>: Multi-line input
• <button>: Submits or triggers action

Tables
• <table>: Table wrapper
• <tr>: Row
• <th>: Header cell
• <td>: Data cell

Semantic Tags
• <header>
• <nav>
• <main>
• <section>
• <article>
• <footer>

Why Semantics Matter
• Better SEO
• Better screen reader support
• Cleaner code

Mini Practice Task
Create a simple profile page:
• Add:
– Heading with your name
– Image
– Short bio paragraph
– List of skills
– Contact form

Double Tap ♥️ For More