What is HTML

### What is HTML?

HTML (HyperText Markup Language) is the standard markup language used to create and structure web pages. It defines how content such as headings, paragraphs, images, links, lists, and forms is organized in a browser.

Key Features of HTML:

• <h1> to <h6>: Define headings and subheadings
• <p>: Creates paragraphs of text
• <a>: Creates hyperlinks to other pages or resources
• <img>: Embeds images into a webpage
• <ul> and <ol>: Create unordered and ordered lists
• <div>: Groups content into a generic block container

### Basic HTML Document Structure

An HTML document contains a doctype declaration, a root <html> element, a <head> section for metadata, and a <body> section for visible webpage content. This structure helps browsers interpret and display the page correctly.

Essential HTML Elements:

• <!DOCTYPE html>: Declares the document as HTML5
• <html>: The root element of the document
• <head>: Contains metadata, the page title, and resource references
• <title>: Sets the title displayed in the browser tab
• <meta>: Provides metadata such as character encoding and viewport settings
• <body>: Contains the main content displayed to users

### The Anatomy of an HTML5 Page

HTML5 provides semantic elements that describe the purpose and organization of webpage content. These elements improve document structure, accessibility, and maintainability, helping browsers, search engines, and assistive technologies understand the page.

Key Semantic Tags:

• <header>: Contains introductory content, a logo, or navigational links
• <nav>: Defines a major block of navigation links
• <main>: Contains the primary content of the document
• <article>: Represents independent, self-contained content such as a blog post
• <section>: Groups related content under a common theme
• <aside>: Contains supplementary content, such as a sidebar or related links
• <footer>: Contains footer information such as copyright notices and contact links

### Why Learn HTML?

HTML is the foundation of web development. Learning HTML enables you to create structured web pages and prepares you to work with CSS for styling and JavaScript for interactive functionality. It is an essential first step for aspiring frontend developers, full-stack developers, and web designers.

Benefits of Learning HTML:

• Build the structure of websites from scratch
• Create accessible content using semantic elements
• Embed images, videos, audio, and hyperlinks
• Integrate CSS and JavaScript into web projects
• Develop a strong foundation for learning frontend frameworks and web technologies

### HTML File Extensions

HTML documents are commonly saved with the .html or .htm extension. You can create and edit HTML files using code editors such as Visual Studio Code, Sublime Text, or Notepad. PHP files can also contain HTML markup, but they require a PHP-enabled server to execute PHP code.

Common File Examples:

• index.html: A common filename for a website's homepage
• about.html: A page containing information about a website or organization
• contact.html: A page containing contact information or a contact form
• index.php: A PHP file that can generate HTML dynamically on the server

### How to Open an HTML File

HTML files can be viewed in modern web browsers such as Google Chrome, Mozilla Firefox, Microsoft Edge, and Safari. After creating and saving an HTML file, open it in a browser to see how the browser renders your markup.

Steps to View an HTML Page:

• Create a new file named index.html
• Write your HTML markup in a code editor
• Save the file with the .html extension
• Double-click the file or open it using your preferred web browser
• Edit the markup and refresh the browser to see your changes

### HTML and Modern Web Development

HTML works together with CSS and JavaScript to create modern websites. HTML defines the content and its meaning, CSS controls presentation and layout, and JavaScript adds behavior and dynamic interactions. Together, these technologies form the core foundation of frontend web development.

The Three Core Technologies:

• HTML: Structures the webpage content
• CSS: Styles the content with colors, layouts, spacing, and typography
• JavaScript: Adds interactivity, event handling, and dynamic updates

By mastering HTML fundamentals and practicing with real examples, you can begin building your own web pages and progress toward more advanced web development concepts.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CodingRider HTML5</title>
</head>
<body>
    <header>
        <h1>Welcome to CodingRider</h1>
    </header>
    <main>
        <article>
            <h2>Learn Semantic Web</h2>
            <p>Write clean, accessible, and structured code.</p>
        </article>
    </main>
</body>
</html>