JUST ME

HTML for Bloggers & Beginners

Learn basic HTML to run your blog optimally! 😀

Hello~~

Today I am not going to talk about events, activities or places; I’m going to post some of the most basic but useful HTML knowledge that I have acquired. Some time ago I learnt basic HTML through a free online course and, while it was fun to learn, I forgot everything after a month because I never used anything I learnt.

However, now that I’m writing a blog using WordPress, I am in the need to use some of the things I learnt to make the posts a bit prettier and easier to read. Because I had forgotten everything, I have had to relearn some of the lessons, and I decided to publish them so that it can be useful to other new bloggers (and also useful to the future me). I hope this is helpful and not too confusing!

main screen of writing draft
You can edit your text with some basic tools (purple), or with HTML (red)

Important note: when I type a code here to show what you need to type to create an effect, the WordPress text editor automatically thinks I am coding, so it converts my code into a result. To avoid this, instead of typing my text into the WordPress text editor, I typed it somewhere else and added screenshots here. I’m sorry for the inconveniences this may cause!

HTML stands for Hyper Text Markup Language, and it is one of the most widespread coding languages. The way it works is by using “<>” and “</>” to open and close codes. Since WordPress and other blog platforms already do most of the work for you, you only need to know some of these codes to modify your font, size, color, etc. Therefore, I’m going to skip the whole HTML architecture lesson because it’s a bit boring =D if you’re interested, you can always take the online course I had, which was really good.

HTML sample
Here you have a sample of how the HTML editor looks like on WP. This is from my own blog~

Text 1


Main Tags:

TEXT 2

example of P vs. SPANMain Attributes:

text 3

I forgot to mention, if you use more than 1 styling attribute, you must separate them by a “;”, like in the example above.

the power of stylingtext 4

So many more options of colors
You can choose among aaaall these colors!

text 5

text 6

JUMP
If you click on this red text then you will…
Get here directly (jump here)
Get here directly (jump here)

If you still don’t know what I’m talking about, check this.


Other tricks & shortcuts:

  • For bold font (also called “strong”), you can just press control B
  • For italic font (also called “emphasized”), you can just press control I
  • For underlined text you can also just press control U
Advertisements

5 thoughts on “HTML for Bloggers & Beginners

    1. Yay! Im glad at least it helped 1 person 🙂 then it was worth writing ^^ If youre interested, I totally recommend to take the free online course I mentioned, it was quite easy to understand and very interactive!

      Liked by 1 person

  1. UHmmm it took me a couple weeks because I was just doing it in my spare time and weekends. I also suggest you doing little by little. Its not too big of a commitment since its free, and you can go at your own pace. I took it once all together very quick, and then before writing this post I took it again to refresh my memory. Practice makes perfect!

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s