HTML coding: Difference between revisions

Revision as of 19:59, 19 December 2021

In this lesson we are going to code our first HTML web page. In future lessons you will also learn how to make your web page accessible to anyone on the internet.

HTML is short for HyperText Markup Language.
It is one of several web browser languages used to support the World Wide Web.
At a basic level, it allows you to code a web page so that it can be interpreted and displayed correctly by a Web Browser.

One of the important constructs in HTML is the Tag.
A tag is identified by the use of the angled brackets, < and >.
They always come in pairs with the < tag followed by the > tag.
With the h1 tag, we need two special pairs. A line of code would look like this.

Hello World

The
tag is called a h1 opening tag.
The tag is called the h1 closing tag (identified by the addition of a / forward slash symbol.
Most other tags using in HTML follow the same pattern or syntax.

The easiest HTML code we can write contains a single h1 heading tag.
This will allow us to test our HTML code in a Web Browser.
To do this we are going to use a new program on the Raspberry Pi called Geany.

@@ Line 8: / Line 8: @@
 * Learning how to include links to other web sites in a HTML page
 * Learn how to include images in a HTML page.
+== Create your first HTML page ==
+* HTML is short for '''HyperText Markup Language'''.
+* It is one of several web browser languages used to support the World Wide Web.
+* At a basic level, it allows you to code a web page so that it can be interpreted and displayed correctly by a Web Browser.
+* One of the important constructs in HTML is the '''Tag'''.
+* A '''tag''' is identified by the use of the angled brackets, '''< and >'''.
+* They always come in pairs with the < tag followed by the > tag.
+* With the h1 tag, we need two special pairs. A line of code would look like this.
+'''<h1>Hello World</h1>'''
+* The '''<h1>''' tag is called a h1 '''opening tag'''.
+* The '''</h1>''' tag is called the h1 '''closing tag''' (identified by the addition of a / forward slash symbol.
+* Most other tags using in HTML follow the same pattern or syntax.
+=== Writing out first h1 heading tag in HTML ===
+* The easiest HTML code we can write contains a single h1 heading tag.
+* This will allow us to test our HTML code in a Web Browser.
+* To do this we are going to use a new program on the Raspberry Pi called '''Geany'''.
+* Click on '''Programming > Geany'''.
+[[File:Screen Shot 2021-12-20 at 6.58.39 am.png]]