Looking at the notes I took from class I am getting confused already! There is quite a few "Tags" to learn all at once before I even start to edit my page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>CFT2111 Module Handbook</title>
</head>
I know the first line is to state that is in fact a HTML document and the second line is obviously pronouncing it to be written in English. The fifth line is the title of the document.
Now, being brand new to any of this language, I am still slightly sketchy to exactly what all the lines do - this is something I will take up with my tutor in the next Web Design class.
Following the tutorial, we was to recreate a page out of our Module Handbook, and place it on a working web page through the use of HTML language.
Here is the page from the handbook:
Here is the same handbook, but what I wrote in HTML to display online:
And finally here is the HTML language I wrote in Crimson Editor:
As you can see (click image to enlarge) I am at the very starting point of writing in this HTML language, and for those of you that have used any type of programming language for more than a day or two, there are probably one or two simple mistakes that you will notice. I did however use the extremely handy HTML validation service at http://validator.w3.org/, and everything checked out perfectly fine.
One annoying part of this tutorial was under the "Assessments" section, where you see a numbered list followed by a bullet point list. So effectively this is a list within a list. In other words the ordered list (the numbered lines) within an unordered list (the lines with bullet points). After a while of trial and error, self learning and a touch of common sense, I finally figured it out.
Here are a few tags I took away from this tutorial:
<h1> through to <h7> (headings, with "1" stating the content within the tags to be large, while "7" would be smaller).
<p> (paragraph)
<ul> (unordered list) (bullet points)
<ol> (ordered list) (numbered list)
<li> (list content)
<hr> (makes a horizontal line across the page)
<em> (emphasizes text) (italic)
<strong> (makes bold text)
Don't forget all lines must be closed with a "/", for example <p>This is a paragraph</p> would read "This is a paragraph" in a web browser.
That's pretty much all the elements I took away from this tutorial, so not bad at all for my very first hour exploring the HTML language!
No comments:
Post a Comment