"HTML Basics: Your First Step into Web Development"

Mansi SinghalMansi Singhal
2 min read

Create an outline to structure your content:

  1. Introduction

    • Briefly introduce HTML and its importance in web development.
  2. What is HTML?

    • Definition and purpose of HTML.

    • Basic structure of an HTML document.

  3. Setting Up

    • Tools needed (text editor, browser).

    • How to create an HTML file.

  4. Basic HTML Tags

    • <html>, <head>, <body>.

    • Explanation and examples of each tag.

  5. Adding Content

    • Text (headings, paragraphs).

    • Images and links.

    • Lists (ordered, unordered).

  6. Conclusion

    Encourage further learning and exploration.

Introduction:

HTML(HyperText Markup Language) is the main language for making web pages. If you want to build your own website or understand how web pages are made, learning HTML is the first step. In this guide, we’ll go over the basics of HTML and show you how to create your first simple webpage.

What is HTML?

HTML is a markup language used to structure content on the web. It consists of a series of elements that define different parts of a webpage. Here’s a basic structure of an HTML document:

<!DOCTYPE html>
<html>
<head>
    <title>My First Webpage</title>
</head>
<body>
    <h1>Welcome to My Website</h1>
    <p>This is my first webpage created with HTML.</p>
</body>
</html>

Setting Up:

To start writing HTML, you only need a text editor (like Notepad or VS Code) and a web browser (like Chrome or Firefox). Create a new file with the .html extension, for example, index.html.

Basic HTML Tags:

HTML documents are made up of elements defined by tags. Here are some essential tags:

  • <html>: The root element.

  • <head>: Contains meta-information about the document.

  • <body>: Contains the content of the document.

Adding Content:

you can add various types of content to your webpage using different HTML tags:

  • Text: <h1> to <h6> for headings and <p> for paragraphs

  •   <!DOCTYPE html>
      <html>
      <head>
          <title>headings</title>
      </head>
      <body>
          <h1>Heading 1</h1>
         <h2>Heading 2</h2>
         <h3>Heading 3</h3>
         <h4>Heading 4</h4>
         <h5>Heading 5</h5>
         <h6>Heading 6</h6>
      </body>
      </html>
    
  • Images: Use the <img> tag.

<img src="image.jpg" alt="Description of image">
  • Links: Use the <a> tag.

      <a href="https://www.example.com">Visit Example</a>
    

Lists: Use <ul> for unordered lists and <ol> for ordered lists.

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

Conclusion:

In conclusion, learning HTML is an essential first step for anyone interested in web development. By understanding the basic structure and tags of HTML, you can create simple yet functional web pages. As you continue to practice and explore more advanced topics, you'll be able to build more complex and interactive websites. Keep experimenting, stay curious, and happy coding!

4
Subscribe to my newsletter

Read articles from Mansi Singhal directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Mansi Singhal
Mansi Singhal