Learn Markdown & HTML

06 Mar 2025

A guide to Markdown and HTML

📘 Learning Markdown and HTML

📝 What is Markdown?

Markdown is a lightweight markup language used to format text in an easy-to-read and easy-to-write way.

Markdown is commonly used for:

  • README files on GitHub
  • Documentation
  • Blogs using Jekyll or Hugo

📌 Markdown Syntax Examples

1. Headings

# Heading H1
## Subheading H2
### Sub-subheading H3

2. Text Formatting

**Bold**  
_Italic_  
~~Strikethrough~~  
`Inline Code`

3. Lists

- Item 1
- Item 2
  - Sub-item

1. First
2. Second
[Click This Link](https://m-zakifahrezi.github.io/OnlyJack.com/)

![Image](/assets/images/coding.png)

5. Code Blocks

<h1>Hello World</h1>

🌐 What is HTML?

HTML (HyperText Markup Language) is the standard language used to create and structure web pages.

HTML is used for:

  • Structuring webpage content
  • Displaying text, images, links, videos, and other elements

📌 Basic HTML Structure

<!DOCTYPE html>
<html>
  <head>
    <title>Page Title</title>
  </head>
  <body>
    <h1>Hello World</h1>
    <p>This is my first paragraph.</p>
    <a href="https://www.instagram.com/zkyy.frezy?igsh=MXB3N21zbm44ZjdwNw==">Visit my social media</a>
  </body>
</html>

🧩 Common HTML Elements

Tag Function
<h1> - <h6> Headings
<p> Paragraph
<a> Link
<img> Image
<ul>, <ol>, <li> Lists
<div> General container
<span> Inline container
<br> Line break

🤝 Markdown vs HTML

Markdown HTML
Easier to read More flexible and powerful
Short and quick to write Ideal for full layout control
Popular on GitHub Used on all web pages

✅ Conclusion

  • Markdown is great for writing simple formatted text like documentation, notes, and blog posts.
  • HTML provides full control over the structure and appearance of a web page.
  • Both are complementary: Markdown is quick and simple, HTML is flexible and complete.
  • Learning both will be a great asset when creating web content or working on open-source projects.

💡 Start with Markdown, then dive into HTML for more advanced control! 🚀