How To Learn HTML Properly

<p>I&rsquo;m not going to waste time explaining to you what HTML is, just follow the prerequisites and you on the roll.</p> <h1>1.Draw Branches in Your Brain</h1> <p>It&rsquo;s Impossible to memorize every HTML semantic tag, properties or attributes, but you can draw branches in your memory to understand how everything is not only connected to each other but how it can be harnessed in other languages and frameworks.</p> <p>&nbsp;</p> <p>Basic Example from&nbsp;TechBit</p> <h1>2. Understand SEO, Visibility &amp; Accessibility</h1> <h2>SEO (Search Engine Optimization)</h2> <p>This is important to understand SEO and how it can drive users/traffic into your website. Metadata, semantic tags contribute a lot to get SEO rankings on Google, Edge and other popular search engines,&nbsp;Search Engine Land&nbsp;has got you covered.</p> <p>&nbsp;</p> <p>Image from&nbsp;Pixabay</p> <h2>Visibility &amp; Accessibility</h2> <p>Coding for visibility is important but coding for accessibility is better, in a world where over 400 million people have disabilities such as visual impairment etc. coding for accessibility. allows your access through screen reader technology.&nbsp;Mozilla Developer Network&nbsp;covered this in detail.</p> <h1>3. Grasp Important Concepts</h1> <p>I have a &lsquo;one-way&rsquo; philosophy most of the time when it comes to marking-up html content, when using semantics I always prioritize accessibility along with visibility meaning I will mark-up in such a way that it optimizes both, here&rsquo;s a few example of the semantics.</p> <h2>&lt;img&gt;</h2> <pre> &lt;figure&gt; &lt;img src=&quot;URL&quot; alt=&quot;alt text&quot;&gt; &lt;figcaption&gt; The Caption&lt;/figcaption&gt; &lt;/figure&gt;</pre> <h2>&lt;form&gt;</h2> <pre> &lt;form&gt; &lt;label for=&quot;name&quot;&gt; &lt;span&gt;Name: &lt;/span&gt; &lt;/label&gt; &lt;input type=&quot;text&quot; name=&quot;username&quot;/&gt; &lt;button type=&quot;submit&quot;&gt;Submit&lt;/button&gt;</pre> <p>These are just a few examples but there a plenty more. The &lsquo;one-way&rsquo; doesn&rsquo;t always apply to everything.</p> <h1>4. Practice! Practice! Practice!</h1> <p>This one is pretty obvious, i can&rsquo;t stress this enough just do it!!!!</p> <p>Mozilla Developer Network&nbsp;has great exercises for you!!! try it!</p> <p>Thank you for reading, lets continue learning, anything i missed please tell me in the comment section.</p> <p><a href="https://medium.com/@amahlesbana/how-to-learn-html-properly-479f58c2e60f">Website</a></p>