Basic HTML Every Blogger Should Know

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Header Banner -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-6251256680476605"
     data-ad-slot="8685617977"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

HTML can be intimidating and takes both patience and practice to master. I remember my first experience with HTML was way back during my freshman year of high school. In 2003, Livejournal was all the rage and if you didn't have one, you weren't cool. Upon starting my own account I discovered that Livejournal wouldn't allow any customization. Having the ability to bold and strike-through text was an absolute necessity. A friend of mine showed me some quick and simple HTML code that I could use in my posts. They weren't complicated, but they did allow me to bold text or customize colors. Fast forward to 2010 - I'm sitting in a graduate class learning some pretty hardcore HTML and CSS and I felt myself struggling to keep up. Although I took classes that specialized in HTML, I learned most of what I know on my own.  I am by no means an expert, but if I can teach myself you can too. If you're really serious about blogging or starting your own website, I highly suggest you learn a little HTML. By learning the basics of HTML, you will gain the ability to better manage your websites' design which can help you stay organized. 

This lesson will include all the basic HTML codes that I feel are important and every blogger should know.

IMAGE CODE

<img src=”http://image.jpg”>

LINKING TO A WEBPAGE

<a href=”http://link.html”>WHAT YOU WANT YOUR LINK TO SAY</a>

OPEN LINK IN A NEW WINDOW

<a href=”http://link.html” target=”blank”>LINK</a>

LINK AN IMAGE

<a href=”http://url.com”><img src=”http://image.jpg”>

IMAGE WITHOUT A BORDER

<img src=”http://image.html” border=”0″>

TEXT CODING

BOLD TEXT

<b>BOLD</b>

ITALICIZE TEXT

<i>Italic</i>

or

<em>Italic</em>

UNDERLINE TEXT

<u>Underline</u>

or

<span style=”text-decoration: underline;”>Underline</span>

ALIGNING TEXT

You can align your text left or right using this code.

<div align=”left”>Align this text to the left</div>

OR

<span align=”left”>Align this text to the left</span>

CHANGE COLOR OF TEXT

 <span style="color:#AA5585; "> this text is purple</span>

HEADINGS

<h1>THIS IS A HEADING</h1>

<h2>THIS IS A HEADING</h2>

<h3>THIS IS A HEADING</h3>

<h4>THIS IS A HEADING</h4>

PARAGRAPHS

<p>Creates a paragraph</p>

CREATE LINE SPACING

Creates a line break<br>

LINK TO AN EMAIL

<a href=”mailto:youremail@gmail.com”>youremail@gmail.com</a>

---

Like anything, practice makes perfect. HTML can be finicky and frustrating, but I promise if you keep at it you and continue learning you will eventually understand. The job I currently have requires me to use HTML on a daily basis and a lot of what I learned I learned on the job. If you still find yourself confused and scratching your head I've included some useful resources below.

http://icanbuildablog.com/html-css-tutorials/

http://lifeyourway.net/understanding-basic-html-blogging-basics-for-beginners/

https://designyourownblog.com/html-and-css-design-bloggers-guide/