HTML cheat sheet: Basic code every blogger should know

HTML & CSS cheatsheet for bloggers

I’ve been using HTML for over 10 years. I learned the basics in a class I took in high school. I was already in love with computers, but this really sparked my love for creating web pages, so I started studying the source code of my favorite websites and doing tutorials for fun in my free time. Then I used what I learned to create several projects and it became second nature to me.

As a blogger, you’ll mostly use HTML in your posts and pages. Most of the time you’ll be using an editor and you won’t have to type code by hand, but it’s still good to learn how to use them on your own so that you can troubleshoot issues. In time, you’ll find that the text editor actually gives you more control over the way your content appears — as opposed to the visual editor, which can be difficult to control.

What is HTML?

HTML, or HyperText Markup Language, is a code language used to structure the content on your site. It uses opening and closing tags to indicate different parts of the content on your site, like paragraphs and titles. Your browser reads and displays the code according to the tags you’ve used.

HTML Cheat Sheet

I’ve put together a cheat sheet with some codes that you may need for your site. I’ve also included a brief description of each tag.

Link

Use this code to create a text link to a page on your site or to another website.

Image

This code will make an image show on your page. The ALT text is a short title for the image. For good SEO, you should always place a good, relevant title in the ALT tag.

Linked Image

This code will link an image to a page on your site or to another website. It’s the same code as the link code above, but with an image tag in place of the text.

Line Break

Use a line break to make your text skip to the next line. If you need to use more than one of these together, you should just go ahead and start a new paragraph.

Paragraph

You guessed it — you’ll use this tag to start a new paragraph — a block of text. You should use a P tag instead of using several line breaks.

Headings

Use headings like section titles. These should be sized from larger to smaller, but it depends on your theme. The H1 tag should really only be used once on a page, since it indicates the most important heading on the page (usually or site title or your post title). H5 and H6 shouldn’t be necessary, but they’re available if you need them.

Bold

Use this tag to make text bold on the page. The i tag is generally considered to be deprecated (old fashioned), so I recommend using the em.

Italic

Use this tag to make text italicized on the page. The i tag is generally considered to be deprecated (old fashioned), so I recommend using the em.

Lists

You can use these tags to organize content into lists. Ordered lists will use numbers, and unordered lists will use bullets. You can have as many list items as you want.

Ordered List

Unordered List

Photo by Crew

Copyright © 2018 The Blog Manual · Theme by 17th Avenue