Includes the entire website plus 3 bonus chapters: Favicon, CSS navigation bar, & inserting Google Map in a web page.
HTML (Hyper Text Markup Language) is the code behind web pages and is what your browser uses to display and format different elements like text, images, hyperlinks and forms in a web page. The fact that it is hyper just means that it is not linear, and you can go to other pages by clicking on links. In this course we’ll be learning XHTML (Extendible HTML) coding which is a stricter and cleaner version of HTML 4.01. HTML is the language that allows us to define the content of a web page and CSS is a series of coding to format or style a web page.
HTML consists of a series of codes denoted by angle brackets like <tag> named tags. These tags are basically a series of simple commands that tell browsers how to define a web page. Web pages are text documents which are saved as an html file, and viewed through a web browser (Internet Explorer, Safari, Chrome, Firefox, etc.). In order to apply a tag to a web page content, you simply wrap the proper tag around that part of the text:
Syntax: <tag>type your text here!</tag>
<!doctype html> <title>My first web page</title> </head>
<body> </body> |
Now go to the desktop and locate the example1.html file and double click it to run it. As the result your computer default browser will open the page with one line showing:
Hello there!
HTML Essential Tags
<html>, <head>, <title> and <body> tags are essential for any html page. These tags must be typed and closed as shown in the example above. |
Here's the explanation of each tag:
Tag |
Purpose |
|
<!doctype html> |
This declaration helps the browser to display a web page correctly. |
|
<html> |
This tag tells the browser that the Notepad document is a web page and not a text document. |
|
<head> |
This tag contains information that is not viewed in your web page. |
|
<title> |
The content of the <title> tag which resides within the <head> tag is displayed at the very top in the browser's title bar and the bookmarks. |
|
<body> |
The area between <body> and </body> is where you put all the elements of your web page (such as text, paragraph, heading text, hyperlinks, images, Flash movies, and tables). |
In the example above, you probably noticed that all commands have an opening and a closing tag, and the content of the tag is placed in between them. You'll also notice that the closing tag is slightly different to the opening tag. The closing tag contains a forward slash “/”. This tells the browser to close the previous tag with the same code. If you don’t close a tag, the HTML command will be applied to the web page content from that point forward. For instance, if you introduce the bold tag <b> somewhere in the content but don’t close it, all the text content from that point forward will be in bold typeface.
Single Tag Exceptions:
The following tags are single tags which do not need closing tags.
<br>
<hr>
<img>
<meta>
Correct: <head> Incorrect: <HEAD>
All the information on this website is also provided in a PDF book for only $30.
Click here to buy.
Home | Internet Basics | Fundamentals | Images & Storyboard | Styling Pages | Page Layout | Languages | Contact us
DigestWebDesign.com offers free Website Design, HTML and CSS Lessons.
Copyright © 2012 - DigestWebDesign.com