Back to UkMirModeration
Basic HTML tutorial
This page gives some a very basic quick introduction to HTML for indymedia uk article. Once you are happy with this read the Imc Uk HTML Style
Your article in HTML is just the ordinary text of your article, but with a few special 'tags'. Tags are enclosed in angle brakets < and >. Tags never show up in the text of the webpage,
they just give the browser instructions like "this is a paragraph".
What it looks like
<p>This is the first paragraph.<br />This bit is
forced onto the next line</p>
<p>This is the second paragraph, and includes a link
to <a href="http://www.indymedia.org.uk">indymedia uk</a></p>
<p>This time the all of this is under a line.
<strong>And this a bit I want to emphasise</strong>.</p>
<li>First in a list</li>
<li>Second in a list</li>
This is the first paragraph.
This bit is forced onto the next line
This is the second paragraph, and includes a link to indymedia uk
This time the all of this is under a line. And this a bit I want to emphasise.
- First in a list
- Second in a list
A paragraph starts with <p> and finishes with </p>
If the tag has something in it notice it always
has an opening tag <p>
then the content
and then a closing tag </p>
To force something onto the next line use <br />
As this doesn't contain anything so it just closes itself with the / in the tag. You will see <br> this is correct too, but an older way of doing it.
For this we use the <a> tag. Anything inside
the <a> and </a> tags is a link somewhere. But of course, the browser needs more information
than that. It needs to know where to link to. So we put some extra info in the <a> tag as
<a href="http://www.indymedia.org">This</a> is a link to Indymedia.
Which comes out as:
is a link to Indymedia.
The word 'This' is now a link, straight to the global IMC site http://www.indymedia.org
. The bit of the tag that says href="http://www.indymedia.org" is just telling the browser where
to link to. It's inside the tag, so it doesn't show up on the page.
See also this note
about linking to stuff also on indymedia uk
Use <strong> and <em> to highlight something
This is <strong>really important</strong>
It would come out as:
This is really important
This needs <em>to be marked out</em> as special too.
This needs to be marked out
as special too.
<b> was used for bold and <i> for italics. But these are outdated tags. Always use <strong> and <em> they actually mean strong emphasis
Unordered lists using <ul> to hold the whole and <li> to contain the individual items.
Or if you want it ordered <ol>
- karl (1818)
- errico (1853)
- che (1928)
More advanced. Headings are defined by <h1> to <h6> in articles don't use <h1> and <h2> see the HTML Style Page
Where To Go From Here?
There are loads of good, free HTML tutorials out there. Just do a search for 'HTML tutorial'
or 'HTML guide'
and you'll find them. WikiKes
likes W3 Schools
The best way to learn, though, is to experiment. Have a look at the HTML code for different websites, and see if you can spot all the different tags working. For example, try right-clicking on this page and selecting 'View Source Code' (or something similar) to see the HTML I used to create this page. Mess around, write a few test pages yourself. All you need to do is:
- Write your page using a text editor like Notepad
- Save it with the extension "htm". With notepad you may have to rename as it is determined to save everything as "txt"
- Doubleclick on the file. If you have managed to save it as a .htm file, it should open in your browser and you will see the results.
- Now experiment!
- 25 Aug 2003 with tips from Vince
- 29 Nov 2003 added examples, made paragraphs more important the line breaks, and added lists, made it xhtml
- 22 Feb 2004 - added an 'e' twice.