Easy HTML Coding All Bloggers Should Know
Hey there! Today I’m sharing something that I hope will help new bloggers. I want to share a little bit about HTML and coding. I know, it’s scary, but what I’m talking about are some easy coding hacks that will help new bloggers with their site. I definitely think it’s important for new bloggers to know a little bit of HTML just to help them get by.
Like I said, this code is very easy. I’m not going to be showing you how to code your entire website, but I am going to give you some snippets of code that will help you tweak your website in the case that your site’s regular post editor isn’t working or you need to add something into the actual HTML of your site.
Head of Page
<head> </head>
The head of the page is where you put some of your scripts, like Google Analytics, etc. The tracker type scripts usually go right before the closing head tag (the one with the forward slash), because there is nothing to show. I’ve also seen some ask to put it right after the opening head tag. If you see a script asking for you to put it in this location, this is the tag you are looking for.
Body of Page
<body> </body>
This is where all of the visible on screen information lies. If you’re looking to put an embedded form on your blog, you’ll usually see the instructions say to put the script right before the closing body tag on any page you want the form to show up on. If you see a script asking for the closing body tag, this is the tag you’re looking for.
Break/Enter
<br> or <br />
This one is pretty easy. If you need to start a new line, you use a break. You can use either an opening or a closing break. Most strict HTML readers require a closing break so I would suggest using the closing one. This is also the only one that has their closing tag with the slash after the letters.
Ex.<br />
Lorem ipsum<br />
Center
<center> </center>
Another easy one, this is used for you to center your text.
Ex. <center>This is my disclosure for affiliate links</center>
Bold
<b> </b>
This one is also easy. This is used for you to bold your text. Just remember, B for bold.
Ex. <b>This is important</b>
Italics
<i> </i>
This one is another easy one. Use this if you want to italicize your text. I for italics.
Ex. <i>This needs to be emphasized</i>
Headers
<h1> <h2> <h3> <h4> <h5> <h6>
</h1> </h2> </h3> </h4> </h5> </h6>
Headers are very important and the numbers mean something. Headers range from 1-6 with 1 being the most important to 6 being the least important. All of my minor headers (as Blogger calls them) are h4. I don’t use anything larger because I don’t really need to.
Link
<a href=”url”>Text</a>
This one is definitely important for bloggers to know. If you’re trying to text link your favorite item, or even an affiliate link, you definitely need to know this HTML bit. It’s actually very easy, just make sure you put the text that you want visible and clickable between the opening and closing “a”.
Ex: <a href=”www.creativelylauren.com”>Creatively Lauren</a>. Creatively Lauren will show up as clickable hyperlink.
Make an Image a Link
<a href=”url”><img alt=”Alt Text” src=”image.png” title=”Title”/></a>
I use this with my main blog images so that when you just go to creativelylauren.com, you can click the blog image and it’ll take you to the post. The Alt text is important for those with incompatible browsers, instead of the picture it will show the words you put there. The title is for when you hover your mouse over the image, it will show the title that you put. For both of these, I just put the blog post title.
Ex. This is what my blog image looks like:
<a href=”https://www.creativelylauren.com/2018/06/easy-html-coding-all-bloggers-should.html”><img alt=”Easy HTML Coding Bloggers Should Know” src=”https://4.bp.blogspot.com/-_IHt6ubXIwg/WxHhjC28tCI/AAAAAAAAQ_A/HIts7bk9-tsE7_gzonZOPmYueifI_AvTACK4BGAYYCw/s1600/Easy%2BHTML%2BCoding%2BAll%2BBloggers%2BShould%2BKnow%2B%25281%2529.png” title=”Easy HTML Coding Bloggers Should Know” /></a>
For HTML help and even some in-depth stuff, visit https://www.w3schools.com/Html/. This resource was very helpful for me when I took my Web Development class two years ago. Even if you don’t check it out, make sure you do know some basics in case you find yourself needing to jump in your blog’s HTML for something.
Did you already know these basics? Let me know in the comments!
