Documentation:EHealth Strategy Office/Tech Support/Website/HTML Basics

	eHealth Strategy Office; Documentation
	Staff Documentation Orientation Manual; Website Guidelines; Social Media Guidelines;
	Technical Support and Training Office Website; Website Administration FAQ; Social Media;
	Research Toolkit Recommended Links;
	Project Documentation HWIP; eHIPP;
	; ;

Getting started with the eHealth Strategy Website
Signing up to the blog Working With Wordpress HTML Basics	Bio Page Template Project Page Template

HTML Resources

Getting Started with HTML - World Wide Web Consortium
HTML Introduction - W3 Schools
HTML Beginner Tutorial - HTML Dog

What is HTML?

HTML stands for HyperText Markup Language. It is a way of describing how a set of text and images should be displayed to the viewer, similar in concept to a newspaper editor’s markup symbols.

HTML is very easy to use; it was designed that way. You don’t have to be a programmer to use it. If you can edit a text file, then you can write HTML (and if you can write an email, you can edit a text file).

HTML Elements (Tags)

The basic unit of HTML markup is called a Tag. You wrap tags around chunks of text that you want to manipulate. These chunks might be paragraphs, they might be bold text, they might be <a href="http://www.google.com/">hyperlinks</a>.

The reason we say “wrap” is because every tag that is opened, must eventually be closed.

An opening tag looks like this: <a>
A closing tag, which begins with a slash, looks like this: </a>
Tags that do not require both an opening and a closing tag, such as line breaks, look like this:

Commonly Used Tags

p. Paragraph. This makes a chunk of text appear like a paragraph, with a little bit of space at the bottom.
br. Line Break. This tag forces a new line to begin. Used to hard wrap text.
a. Anchor. These make links. Not sure why they don’t call it a link, but hey.
img. IMaGe. Allows you to insert images into your page.
div. Division. This is a general block element that allows you to create styles around.

Attributes

Most tags also carry things called attributes. This is a way of specifying specific things that you want to make happen.

Tags with attributes inside it looks like this:

<a href="http://www.google.com/">This will be a link to Google.</a>

Tag : a: Attribute 'href'. Reference: website that the link will go to. (Don't forget the http:// !!)

<img src="http://flickr.com/.../example.jpg" alt="An example image" height="250" width="400" />

Tag : img: Atrribute 'src'. Source: where the actual image is located (most often a URL); Attribute 'alt'. Alternate text: words that are used by screen readers for blind visitors and search engines.; Attribute 'height'. Specifies how high (in pixels) you want your image to appear.; Attribute 'width'. Specificies how wide (in pixels) you want your image to appear.