Master HTML in 2 min.

</span>
 lang="en">

   charset="UTF-8">
  My First Page


  Welcome to My Website





    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  2. Head Elements
Used to include metadata, styles, and scripts.


  Portfolio
   name="viewport" content="width=device-width, initial-scale=1.0">
   rel="stylesheet" href="styles.css">
  
    body { font-family: Arial, sans-serif; }
  
  <span class="na">src="app.js" defer>




    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  3. Text Formatting Tags

Main Heading
This is a bold and italic sentence.
Highlighted text
Smaller font
"This is a quoted text."





    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  4. Lists: Ordered, Unordered & Description


  HTML
  CSS



  First
  Second



  HTML
  HyperText Markup Language




    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  5. Links and Anchor Tags

 href="https://google.com" target="_blank">Open Google
 href="resume.pdf" download>Download Resume
 href="mailto:you@example.com">Email Me



    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  6. Images with Attributes

 src="photo.jpg" alt="A scenic view" width="400" loading="lazy">



    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  7. Tables: Structuring Data

 border="1">
  
    ProductPrice
  
  
    Pen$1
    Notebook$2
  




    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  8. Forms: Collecting Input

 action="/submit" method="POST">
   for="name">Name:
   type="text" id="name" name="name" placeholder="Your Name" required>

   for="msg">Message:
   id="msg" name="message" rows="4">

   for="gender">Gender:
   id="gender" name="gender">
     value="male">Male
     value="female">Female
  

   type="submit">Submit




    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  9. Embedding Media

 width="320" height="240" controls>
   src="video.mp4" type="video/mp4">
  Your browser does not support the video tag.


 controls>
   src="sound.mp3" type="audio/mpeg">




    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  10. Semantic HTML Tags


  My Blog



   href="/">Home
   href="/about">About



  
    
      Article Title
      This is a blog post.
    
  



  © 2025 My Blog




    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  11. Inline vs Block Elements


Block elements start on a new line.


This is a block-level element.
Paragraph is also block-level.



    Enter fullscreen mode
    


    Exit fullscreen mode
    






Inline elements do not start on a new line.


This is inline
 href="#">Link is also inline



    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  12. Global Attributes

 id="main" class="container" data-user="123" hidden lang="en" style="color:blue;">



    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  13. Deprecated Tags (Avoid These!)


Centered Text
 color="blue">Old Way of Styling
 src="music.mid"> 



    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  14. Accessibility & SEO Tips

Use  on images:


 src="logo.png" alt="Company Logo">



    Enter fullscreen mode
    


    Exit fullscreen mode
    





Use headings logically:


Main Title
Section Title
Subsection



    Enter fullscreen mode
    


    Exit fullscreen mode
    





Use ARIA roles if needed:


 role="navigation">...



    Enter fullscreen mode
    


    Exit fullscreen mode
    





  
  
  BONUS: Get the Full eBook
This article is just the tip of the iceberg.Unlock your full potential with "HTML, CSS & JavaScript for Web Developers"
Packed with examples, practice projects, and cheat sheets for rapid learning!Download Now:
codewithdhanian.gumroad.com/l/ydhfb