In Blogger, when you hit the 'New Post' button, you're presented with a 'Compose' window in which to place and compose your text. Of course, you can prepare your text first in a word processor and copy 'n' paste it in - but beware - this can also bring in unwanted font and other formatting too (just take a peep in the 'Edit HTML' window and you may see unnecessary coding, such as <div style="font: 12.0px Verdana; margin: 0.0px 0.0px 0.0px 0.0px;">! Scary! The tags we'll discuss today are the B, I and Link buttons. To make a word bold, highlight it and hit B. Similarly to make a word or phrase italic, highlight it and hit I. Simple.
What it's doing for you is surrounding those particular words with tags.
The code we are going to use here is called HTML (Hypertext Markup Language) - which is more of a programming language than the kind of code you would expect to use for secret messages - or more strictly speaking, XHTML (Extensible Hypertext Markup Language), which became W3C (World Wide Web Consortium) recommended in 2000 and as the name suggests is a little bit stricter. A website that conforms to an XHTML specification is said to be valid.
To make a word bold we code it thus
<b>bold word</b>
to make it italic we make it
<i>italic word</i>.
The letters in angled brackets, the < “less than” and > “greater than” symbols, are called tags and usually come in pairs that surround the text affected, the closing tag being preceded by a forward slash. An important exception is the tag for line break, which used to be written <br>, but to bring it in line with current XHTML standards, it is now written <br />.
The best thing about the web is that you can create hypertext 'hot links' to other pages on your blog, or to other unrelated pages on any other website anywhere in the world. To do this, you insert anchors: in this case absolute ones containing the full URL (Uniform Resource Locator) of the page you want to link to. An anchor is of the form:
<a href="url">the hot text</a>
where the full URL is for example http://fredpipes.tumblr.com/ - the address of my Tumblr site. The a stands for anchor and is used in different forms that we will see later; the href attribute defines the link "address". A link to an email address is of the form:
<a href="mailto:janedoe@janedoephotography.co.uk">janedoe@janedoephotography.co.uk</a>
In Blogger, all you have to do is highlight the text you want to make into a hot link, and paste the URL of the website into the box that appears. The easiest way to do this is to visit that website and copy the address from the top of your browser.
Adding external links to your website is generally a good thing. If you link to someone and they link back to your site, then the search engines will give you a higher rating. But you don't want people leaving your site as soon as they have arrived, so adding the expression
target="_blank"
to the link code opens the linked site in a new browser window of its own, leaving your site still in view, viz:
<a href="http://www.external-site.com" target="_blank">An external link</a>
Wordpress offers you a check box to do this but at the time of writing Blogger doesn't.
For a full list of tags, see http://www.w3schools.com/tags/default.asp target="_blank"
Wednesday 29 June 2011
Welcome
Well, hello. This blog is to accompany my (forthcoming) book How to design websites. Of course, if you don't want the hassle of learning HTML and CSS, why not get a blog like this one. I've gone for a Blogger blog (web log) for historical reasons, but there is also Wordpress, which I think is slightly more versatile, and Tumblr, which I have only recently discovered, which is simplicity itself - and highly tuned to social networking, though some of the templates are a bit fussy for my liking. Other blogging platforms are available!
The advantages of a blog are that you don't have to worry about coding or hosting, they're free, and you can learn to add bells and whistles as you go along. They are also self-archiving - basically they are just a diary or journal with the newest entry showing at the top of the page. The hardest part about them is choosing the right template, though they can be customised to make them look like a regular website. I'll show you how. As you progress, you may wish to learn a little coding so you can work in the 'Edit HTML' window, say if you want to add a link to a Flickr photo, or as I have been doing just now, adding target="_blank" to the link code so that the page linked to opens in a new window. So, that's enough for now - why not start a blog yourself to see how you get on, afterall you've got nothing to lose!
The advantages of a blog are that you don't have to worry about coding or hosting, they're free, and you can learn to add bells and whistles as you go along. They are also self-archiving - basically they are just a diary or journal with the newest entry showing at the top of the page. The hardest part about them is choosing the right template, though they can be customised to make them look like a regular website. I'll show you how. As you progress, you may wish to learn a little coding so you can work in the 'Edit HTML' window, say if you want to add a link to a Flickr photo, or as I have been doing just now, adding target="_blank" to the link code so that the page linked to opens in a new window. So, that's enough for now - why not start a blog yourself to see how you get on, afterall you've got nothing to lose!
Subscribe to:
Posts (Atom)