DEV Community

Cover image for My Web Development Journey Day-1: HTML ๐Ÿš€
Bidut Sharkar Shemanto
Bidut Sharkar Shemanto

Posted on

My Web Development Journey Day-1: HTML ๐Ÿš€

Last month, I decided to sign up for a web development course by Jhankar Mahbub bhai - Programming Hero. The reason I signed up is because of the intense support system of Programming Hero and it teaches you with a certain goal - land a job/internship after completing the course.

Next year (2025) I will graduate from my university, and I don't want to be unemployed after that. So, I took on the mission of becoming a web developer by the end of 2024.

Module 1: Learn and Explore HTML ๐Ÿ“š

Topics I learned:

  1. HTML Structure (title, favicon)
  2. HTML tags: Paragraphs, Headings, Button, Line break
  3. Tag Attributes, elements
  4. Text Formatting (small, strong, bold, italic, emphasize)
  5. Block vs Inline
  6. Lists (Ordered, Unordered)
  7. Ordered list types
  8. Unordered list types
  9. Anchor tag (open in new tab, download)
  10. Image

This is the HTML I wrote for practice:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Travel Blog</title>
    <link rel="icon" href="\travel.png">
</head>
<body>
    <div>
        <!-- This this the welcoming Section -->
        <h1>Welcome To My Blog!</h1>
        <h2>I am Shemanto,<span style="color: #e0a82e; font-weight: bold;">THE TRAVELER</span></h2>
    </div>

    <div>
        <!--The places I Traveled-->
        <h3>These are the places I traveled so far:</h3>
        <ol type="i">
            <li>Sundorban</li>
            <li>Rajshahi</li>
            <li>Chittagong</li>
            <li>Rongpur</li>
            <li>Mymensingh</li>

        </ol>

    </div>

    <div>
        <!-- Favorite Food Lists -->
         <h3>My favorite food lists</h3>
         <ul type="square">
            <li>Rice & Egg vaji with hot lantil</li>
            <li>Mutton Biriani</li>
            <li>Guava Fruit</li>
            <li>Pocket Gate er Khichuri & Dim vaji with Tomato vorta</li>
         </ul>
    </div>

    <div>
        <!-- Images of Food  -->
         <h3>This are the images of Foods that I liked so far</h3>
         <span><img src="https://images.immediate.co.uk/production/volatile/sites/30/2020/08/chorizo-mozarella-gnocchi-bake-cropped-9ab73a3.jpg?quality=90&resize=556,505" alt="torkari" width="300" height="300"></span>
         <span><img src="https://loveincorporated.blob.core.windows.net/contentimages/gallery/d99329d6-ce59-4e2d-9513-96a879c7a4ae-gnocchibake.jpg" alt="sukna torkari" width="300" height="300"></span>
         <span><img src="https://media.self.com/photos/5acf7250164ba7734f61bca2/4:3/w_320%2Cc_limit/DINNER_09_BAKEDEGGS_071.jpg" alt="tomato torkari" width="300" height="300"></span>
         <span><img src="https://images.immediate.co.uk/production/volatile/sites/30/2022/08/Corndogs-7832ef6.jpg?quality=90&resize=556,505" alt="fastfood" width="300" height="300"></span>
    </div>

    <div>
        <button> <a href="https://www.linkedin.com/in/shemanto/" target="_blank">My LinkedIn Account</a> </button>
        <button><a href="\travel.png" download="download image">Download FabIcon</a></button>
    </div>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Practice HTML

Top comments (0)