Friday , 24 November 2017
Some of you may already be super familiar with HTML, but to some of you, it may look like a completely incomprehensible foreign language.

HTML Basics Every Blogger Should Know

I Love You, Blogs and Coffee (ESPRESSO)

I Love You, Blogs and Coffee (ESPRESSO) by: jenniferramos

 

Some of you may already be super familiar with HTML, but to some of you, it may look like a completely incomprehensible foreign language. If that is the case, allow me to help break down some of the very basic components of HTML. Manipulating the HTML within your blog can help you enhance your posts.

Open in a new window/tab.
Keep people in your blog when they click on the links within your posts. You can edit the web URL link by adding target=”_blank” to the end of the web address, as shown in the example below. This will make it so that whenever your readers click on one of your links, the new location is opened up in another tab or window. They will never have to hit the back button to try to navigate towards your blog!

Adjust the size of your images.
The width of this blog is 470 pixels. The width of images in my Etsy shop are 570 pixels. That means, I have to adjust them so they are 100 or more pixels smaller when I place them in the context of one of my posts. I do this by adding width=”470″ after the image location URL, as shown in the example below. The picture will stay proportional in size when only given a specified width or height measurement, so there is no need for me to figure out what the other measurement would need to be. This comes in handy when I am working with images of different widths, but want them all to be the same height, or vice-versa.

Aligning images and text.
If an image is smaller than the width of my blog column, then it tends to look better if it is centered, or embedded into the left or right of a field of text. Simply adding align=”center” or align=”left” does the trick! To align text so it is centered, use style=”text-align: center” in your paragraph tag, as shown in the example below.

Working with HTML tables.
Many of you have seen and adore my Treasury Tuesday features. These are Etsy treasuries, translated into HTML tables so that they can easily be allied to this WordPress blog. While I could construct these tables on my own if I wanted to, I cheat a little bit and let Red Row Studio make up the basic code for me to begin with. Now, because my blog column is 470 pixels wide, the best fit is a 3 column treasury, which leaves one odd item dangling at the bottom. To eliminate this awkward balance, I can go into the end of the code and delete the last table row, or “tr”. I also add the align=”center” to the table properties so that the tables are nicely centered in my blog posts.

Those are some of the most common HTML bits I utilize when blogging. I know that there are some small differences when working with WordPress or Blogger, but most of the general rules apply.

This post originally appeared in my blog, Megan’s Creative Blog, on April 9th, 2012. 

Related Posts Plugin for WordPress, Blogger...

6 comments

  1. Thanks bunches for this post! I’m quick with a needle and thread, but not nearly as quick with a keyboard, as I am sure many of your artist readers are! I have so much room to improve on my blog, and these tips will surely get me some progress. Thanks again!

  2. I agree, knowing a little HTML is important. I use Blogger, but the ‘Compose’ WYSIWYG editor can still mess things up, and if I know some HTML I can go in and fix it. I think knowing some of the common tags, like p, div and br is also helpful.

    • I use us the br tab when working in Blogger all of the time! I think it’s because the platform doesn’t automatically add hard returns and breaks the way WordPress does, so you have to go back in and add them.

  3. I need to take a class, I guess, because I still don’t know what you are talking about! I just don’t get this stuff!
    I need to make a adjust my logo for my facebook timeline and I am at a complete loss there too!…so I need to find the time for all this!
    On top of shows, listing, creating, eating and of course…sleep

    But thanks

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>