HTML Basics

HTML (HyperText Markup Language) gives structure to your content. It’s the standard language used to create webpages.

💡 In Markdown (which you’re using in .md files via fastpages), you can do many similar things with simpler syntax. Here’s how HTML compares and expands on that.

Headings, Paragraphs, and Emphasis

Markdown:

# Welcome to My Web Page
This page uses **HTML** to display content and *JavaScript* to make it fun!

HTML:

<h1>Welcome to My Web Page</h1>
<p>This page uses <b>HTML</b> to display content and <i>JavaScript</i> to make it fun!</p>

Markdown:

[Visit MDN Web Docs](https://developer.mozilla.org)

- Learn HTML
- Practice JavaScript
- Have fun coding

HTML:

<a href="https://developer.mozilla.org">Visit MDN Web Docs</a>

<ul>
  <li>Learn HTML</li>
  <li>Practice JavaScript</li>
  <li>Have fun coding</li>
</ul>
Feature Markdown Syntax HTML Syntax
Heading 1 # Heading <h1>Heading</h1>
Heading 2 ## Subheading <h2>Subheading</h2>
Bold **bold** or __bold__ <b>bold</b> or <strong>bold</strong>
Italic *italic* or _italic_ <i>italic</i> or <em>italic</em>
Link [OpenAI](https://openai.com) <a href="https://openai.com">OpenAI</a>
Image ![Alt](image.png) <img src="image.png" alt="Alt">
Unordered List - Item or * Item <ul><li>Item</li></ul>
Ordered List 1. First <ol><li>First</li></ol>
Paragraph blank line between text <p>Paragraph</p>
Line Break &nbsp; or two spaces then Enter <br>
Code (inline) `code` <code>code</code>
Code Block `js
console.log('hi')
`		 <pre><code>console.log('hi')</code></pre>