Lesson 02: Basic (X)HTML Structure

In this lesson you will learn about each of the units within this course.
This lesson should take you approximately 60 minutes.

Introduction | Basic Structure | XHTML Standard | Activity | HTML Time Saver

Introduction

The coding that you will use to create your web pages has a basic outline that you will use when creating all your web pages. This lesson has critical information for your success. Take the time to watch all the tutorials and read all the information. You may even want to review this information periodically.

Basic Structure

The basic structure of a web page is extremely simple. The really exciting thing about writing HTML, is that you can test it out immediately to see how it works. Let's start by producing some very simple web pages just to get some practice.

Follow along with this basic XHTML structure tutorial to create the basic outline for your first web page.

All the web pages that you create for our company must include this basic structure. You will also be required to include meta tags. They give search engines information about your site. Check out the W3Schools for more information about meta tag elements.

I will expect an author and generator tag on every page you make. Add keywords and description to each of the web site home pages you make.

Doctype

The <!doctype> declaration is the very first thing in your document, before the <html> tag. This tag tells the browser which HTML or XHTML specifications the document uses.

http://www.w3schools.com/tags/tag_doctype.asp

top

XHTML Standards

Coding Terms and Company Policy

Since we have many employees working in our company, we expect all our employees to follow the same simple set of conventions.
Differences Between XHTML and HTML - Some of the tutorials in this class will be based on outdated HTML coding. Use these guidelines in updating your coding. *Rated "Excellent Resource" by our guest BCC instructor.

All tags and attributes must be in lower case.
XHTML elements must be properly nested
XHTML documents must be well-formed
All XHTML elements must be closed
All values will be quoted.
Table tags will use indenting (more on that later)
All file and folder names will be lower case with no spaces (use an underscore if needed)
Use returns to separate sections of your code

Some of the tutorials that we use, will not follow these conventions. However, since this is company policy, you will be expected to follow them. Your employee evaluations will be assessed using these conventions!

Please review this tutorial explaining all of the XHTML standards you will be expected to use in this course.

HTML is broken down into elements, attributes, and values.
Understanding HTML Building Blocks Tutorial

top

Activity

Copy the text for the following pages from the "Files" folder of the Unit 03 folder. Paste each into a new text file and save it with the .html file extension. Then add the basic XHTML structure to each of the page. DO NOT retype the text based on what is in the video tutorials or you will loose credit for the assignment! I change the text every year so make sure to download the newest text.

index
businesses
contacts
form

Turn it in: Upload all four web pages to your FTP folder. Send your instructor an email with the URL's for each of the web pages.

Grading Rubric

Tag Point Possible

Doctype 1

html 2

head 2

title 2

body 2

meta 4

top

HTML Time Saver

Create a blank web page that contains the basic structure and tags that you will need on all your web pages.
*Doctype, html, head, title, meta, body
Then save it as "blank.html".
When you need to start a new page, simply open up your "blank" page and save it as the new file name.

top