HTML - Nimbus Code

1. Introduction

HTML (HyperText Markup Language) is the standard markup language for documents designed to be displayed in a web browser. It defines the structure and content of web pages, while CSS handles the presentation and JavaScript handles the behavior.

HTML consists of a series of elements, which you use to enclose, or wrap, different parts of the content to make it appear a certain way, or act a certain way. HTML is the foundation of the Web, forming the building blocks of all websites.

2. Syntax Examples

Basic HTML Document Structure

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Web Page</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header>
        <h1>Welcome to My Website</h1>
    </header>
    
    <main>
        <section>
            <h2>About Me</h2>
            <p>This is a paragraph about me.</p>
        </section>
    </main>
    
    <footer>
        <p>© 2025 My Website</p>
    </footer>
    
    <script src="script.js"></script>
</body>
</html>

Common HTML Elements

<!-- Headings -->
<h1>Heading Level 1</h1>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>

<!-- Paragraph with strong and emphasis -->
<p>
  This is a paragraph with <strong>bold text</strong> and 
  <em>emphasized text</em>.
</p>

<!-- Link -->
<a href="https://example.com" target="_blank">Visit Example.com</a>

<!-- Image -->
<img src="image.jpg" alt="Description of image" width="300" height="200">

<!-- Lists -->
<ul>
  <li>Unordered list item 1</li>
  <li>Unordered list item 2</li>
</ul>

<ol>
  <li>Ordered list item 1</li>
  <li>Ordered list item 2</li>
</ol>

Forms and Input Elements

<form action="/submit" method="post">
  <div>
    <label for="name">Name:</label>
    <input type="text" id="name" name="name" required>
  </div>
  
  <div>
    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required>
  </div>
  
  <div>
    <label for="message">Message:</label>
    <textarea id="message" name="message" rows="4"></textarea>
  </div>
  
  <div>
    <label>
      <input type="checkbox" name="subscribe" value="yes"> 
      Subscribe to newsletter
    </label>
  </div>
  
  <button type="submit">Submit</button>
</form>

3. Main Uses

HTML is the fundamental language for creating web content:

Creating websites and web applications
Structuring content semantically
Embedding media (images, video, audio)
Building forms for user input
Creating hyperlinks between documents
Implementing accessibility features
Supporting search engine optimization (SEO)
Creating email templates

4. Pros and Cons

Advantages

Easy to learn and use
Supported by all browsers
Semantic markup improves accessibility
Works with any server-side language
Free to use and open standard
Backward compatibility
Modern HTML5 has rich feature set

Limitations

Static by itself (needs CSS/JS for dynamic content)
No built-in database functionality
Browser inconsistencies can cause display issues
Security limitations (can't access user's file system)
Alone cannot create complex applications
Requires additional technologies for interactivity
Can become verbose for complex structures

5. HTML Evolution

HTML has evolved significantly since its inception:

HTML 1.0 (1991) - Initial release by Tim Berners-Lee
HTML 2.0 (1995) - First standard specification
HTML 3.2 (1997) - Added tables, applets, text flow around images
HTML 4.01 (1999) - Added stylesheets, scripts, frames, embedded objects
XHTML 1.0 (2000) - Reformulation of HTML 4.01 as XML application
HTML5 (2014) - Added semantic elements, video/audio support, canvas
HTML5.1 (2016) and HTML5.2 (2017) - Incremental improvements
HTML Living Standard (current) - Continuously updated by WHATWG

Modern web development uses HTML5, which is maintained as a "living standard" that evolves continuously rather than through version numbers.

6. Learning Resources

Here are some excellent resources for learning HTML:

MDN Web Docs (HTML) - Comprehensive documentation and guides
W3Schools HTML Tutorial - Interactive tutorials and examples
HTML Reference - Visual guide to HTML elements
freeCodeCamp HTML/CSS Course - Interactive learning
Learn HTML by web.dev - Modern HTML practices

7. Related Technologies

Technologies that work with HTML: