By Erica Mueller | Leave A Comment
After a brief problem with my blog’s visual editor, and having to rely on my HTML knowledge, I started to wonder… Do bloggers know the basic HTML they need?
Some blogs you contribute to may have their visual editors turned off, requiring writers to use HTML to style their entries. Other times you may need to manually edit some HTML in a widget or post.
A few basic HTML tags every blogger needs to know.
Header Tags:
Your page and post titles are built using header or ‘h’ tags. The trick to these is remembering that the lower the number, the larger the font. Header tag sizes are determined by your theme’s css file, so if you need to change them, you can. A Header tag looks like this: <h1> and is closed in this manner </h1>
Bold, or Italics
It’s easy to change the style of your font with some basic style tags:
<strong>Bold</strong>
<em>Italiacs</em>
Underline and Strikethrough
These two are a little more tricky, as they require span style tags, but a lot of people like to use these, especially the strikethrough option.
<span style=”text-decoration: underline;”>Underline</span>
<span style=”text-decoration: line-through;”>Strikethough</span>
Links
For me, the hardest to remember are link codes, and the options to go with them. Here are a few basics:
Plain ol’ Link – <a href=”http://www.google.com”>Plain ol’ Link</a>
Open Link in New Window – <a href=”http://www.google.com” target=”_blank”>Open Link in New Window</a>
Open Link in Same Window – <a href=”http://www.google.com” target=”_self”>Open Link in Same Window</a>
Alignment
<p style=”text-align: right;”>Paragraphs, lines of text, and some images can be aligned using <p> style tags like this. Align Right. Of course you can change the alignment quite easily!</p>
Images
This image is linking to itself (image file), is aligned left, and has both an image title and alt-text.
<a href=”http://blissfullydomestic.com/wp-content/uploads/DSC07476.jpg”><img title=”Image Title Goes Here” src=”http://blissfullydomestic.com/wp-content/uploads/DSC07476-150×150.jpg” alt=”Alternate Text Goes Here” width=”150″ height=”150″ /></a>
Do you dabble in HTML? Is there more HTML you’d like to know?
ABOUT Erica Mueller
Erica is a geek mom through and through. Her passion is helping small businesses and bloggers put th{read more}
Loading ...
I’ve taught myself a LOT of html this past year, but surprisingly, I didn’t know some of the basics here (target, etc). Thanks for sharing!
You’re welcome. Yes, it helps to have a list to refer to, as we can’t always memorize all these codes! I know for me, the different targets for links are so hard to remember, as are the varying ways to align images. Truth be told, I need this list!! hehe
Great idea! I was just teaching a fellow blogger this morning how to do a Link to text box.
Pingback: Weekend Links, 8.21.10 — Giving Up on Perfect
I just switched over to WP.org and there is definitely more html I want to know. I can’t even change font without knowing html and I honestly know nothing. Thanks for these tips!
Julie, if you go to Users/Profile in your blog’s dashboard you can uncheck the ‘hide visual editor’ box and you’ll have a nice rich text editor in your post/page editors! This makes things much easier for beginners!
Thanks for generously sharing the tips. I know most, but use them so rarely that I have to stop and think hard–having them written out so clearly is a help.
I would like to figure out how to change/edit the font in the CSS in a WordPress theme. I have not been able to do that. The rich text editor of my theme–Coraline–does not allow changing the text font. That’s okay at the moment–I like the text.
Great list, and great resource! A friend asked me the other day how I “got into” blogging. I realized that it really all started back in 1998 when I taught myself raw HTML as a hobby and starting building webpages from scratch. I took a long break from being online, but started blogging in 2005. Boy, that knowledge of HTML sure comes in handy with my blog now!
Thank you for the feedback! Perhaps a little CSS tutorial should be in my post lineup!
Stacey,
I think that’s about when I started with HTML too! Or, maybe it was 2000. I started with Microsoft Publisher, the FrontPage, then graduated to Dreamweaver which I still use on occasion! I do think blogging is easier once you have a basic knowledge of HTML, and some good CSS experience helps a lot too!
Ooh, great post. I love that there were some codes on here I have always wondered about. I never knew how to do strike-through or how to open a link in a new window.
I used to code on AOL in Rainman (their language) and I had my own website which I coded by hand a lot, but there is sooooo much I don’t know.
I have been teaching myself html for a while now but it is more on an “as needed” basis. This is a great list to keep handy.
I like target=”_top” for links as it will open 1 new window the first time, then throw any additional links you click into it.
I learned html & coded entire sites from scratch when I first started. It really does help to know the basics. Thanks for putting this out there!
Heather, that sounds like a nice tip, especially for browsers that might not have tabs enabled. For me, using a tabbed Firefox browser, opening in a new window actually just brings up a new tab, so I don’t have tons of windows open.
Thanks for the addition to the tip-list!!
Great tip! This is something I definitely need to put a little more time into. I plan on trying to build a site in the near future and you have to start with the basics.
Yes, and there are so many tutorials out there for bloggers and web developers. Google is a fabulous place to start.
Right now, I’m loving WordPress as a starting point for building sites. They don’t have to be blogs!! WordPress is a Content Management System that’s perfect for all kinds of sites. Once you get started, you can’t stop. 
I hope you have lots of fun building your site!