Sunday 6 January 2013

Web Design For Beginners: Using HTML To Create Your Own Widgets


It may sound complicated and time consuming but it’s actually very easy, and as part of my current focus on blog customization I thought I’d share some tips I gathered while studying graphic design at uni. I’m starting with the basics – creating your own blog widgets to give yourself better control over the look and performance of your blog. Here’s a preview and the full article is over at my new blog, BeyondTheHourglassBridge.wordpress.com. Head on over there and follow because I won’t be posting here for long. And of course, enjoy!

Web Design For Beginners: Using HTML To Create Your Own Widgets:



Simply put, HTML coding involves giving the computer commands in the form of pairs of <> brackets. One <> will open the command, one <> MUST close it, and whatever content sits between the <> and <> brackets will be affected by that command. For example if your brackets involve a link command, then whatever text you put in-between those brackets will become a hyperlink.

i.e. the code to create a link is <a href="http://www.examplelink.com">My Link Text</a> and the words My Link Text will display as a hyperlink

The problem here is that the link will load on the page your reader is viewing, so it will effectively take them away from your blog. To ensure that the link instead opens in a new window, you add the instruction target="blank" within the first <a> bracket.

So your new code looks like this <a href="http://www.examplelink.com" target="blank">My Link Text</a>

Now let's say you'd like to create a simple widget which displays all your social media hangouts in one. Here is the template…

(Well, technically here is the template :P )

3 comments:

  1. I use basic HTML on my blog. I think the thought of programming puts a lot of people off, but as you state, it's actually quite easy.

    ReplyDelete