PPT 1.1
HTML5 and CSS3 – Illustrated, 2nd Edition
Unit A: Getting Started with HTML
A Guide to this Instructor’s Manual:
We have designed this Instructor’s Manual to supplement and enhance your teaching experience
through classroom activities and a cohesive chapter summary.
This document is organized chronologically, using the same heading in dark blue that you see in the
textbook. Under each heading you will find (in order): Lecture Notes that summarize the section,
Figures and Boxes found in the section, if any, Teacher Tips, and Classroom Activities and/or Lab
Activities. Pay special attention to teaching tips, and activities geared towards quizzing your students,
enhancing their critical thinking skills, and encouraging experimentation within the software.
In addition to this Instructor’s Manual, our Instructor’s Resources CD also contains PowerPoint
Presentations, Test Banks, and other supplements to aid in your teaching experience.
For your students:
Our latest online feature, CourseCasts, is a library of weekly podcasts designed to keep your
students up to date with the latest in technology news. Direct your students to
T
T
Ta
a
ab
b
bl
l
le
e
e
o
o
of
f
f
C
C
Co
o
on
n
nt
t
te
e
en
n
nt
t
ts
s
s
Unit Objectives
2
2: Define a Project Plan
2
4: Create Wireframes and a Storyboard
3
6: Create an HTML Document
5
8: Set Up the Document Head and Body
6
10: Add Text to a Web Page
8
12: Add a Comment to a Web Document
9
14: Preview your Web Page on a Desktop Computer
10
16: Configure Web Server Software
18: Preview Your Web Page on Mobile Devices
12
13
End of Unit Material
14
Glossary of Key Terms
14
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 2 of 15
U
U
Un
n
ni
i
it
t
t
O
O
Ob
b
bj
j
je
e
ec
c
ct
t
ti
i
iv
v
ve
e
es
s
s
Students will have mastered the material in Unit A when they can:
• Define a project plan
• Create wireframes and a storyboard
• Create an HTML document
• Preview their web page on a desktop
computer
• Configure a local web server
2
2
2:
:
:
D
D
De
e
ef
f
fi
i
in
n
ne
e
e
a
a
a
P
P
Pr
r
ro
o
oj
j
je
e
ec
c
ct
t
t
P
P
Pl
l
la
a
an
n
n
LECTURE NOTES
• Define a project plan, also known as a design document, as a document that identifies various
aspects of the website, such as goals, objectives and target audience, and explain the importance of
preparing a project plan.
• Explain that in order to identify the goals and objectives of a website, the website designer must ask
a variety of questions regarding the client’s goals, objectives, expectations, and target audience. Give
examples for such questions.
• Show students how websites that are directed to different audiences look different, and explain that
this is the reason it is important to understand who the target audience is prior to planning the
design of a website. Give examples of questions that can be asked in order to identify the target
audience: questions identifying users, such as gender and age range; questions identifying user’s
needs, such as why they will be visiting the website; and questions identifying user’s technological
tools, such as the type of operating system they use or the screen resolution at which they will be
viewing the website.
• Stress that it is important to ask questions in the design phase even if you know the client won’t
have ready answers to most of the questions, because even having some information can greatly
assist in planning a user-friendly website.
• Explain to students that websites usually have one or two main functions, and give examples, such
as serving as an online informational brochure, providing information for special interest groups,
• Note that based on the expected scope of the project and prior to doing any work, a website
designer should develop a budget, which will be included in the project plan and will become part
of the contract with the client.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 3 of 15
FIGURE: A-1
BOXES:
1. Quick Tip: Listing exclusions in the project plan will help reduce the potential for scope creep,
which is the expansion of a project beyond the original goals and objectives.
2. Clues to Use: Deciding how much to charge
Estimating the amount of time a project will take can be difficult, especially for new web designers. If
you work for a web design agency, the budget will typically be developed by your supervisors. If you
are a freelance web designer, you must place a value on your time that takes many things into
consideration, such as the cost of computer equipment and software, supplying your own insurance,
advertising, and other expenses. There really is no set hourly or project fee in this industry, as it varies
dramatically depending upon the geographic market, competition, and experience level of the web
designer. New web designers often barter, or trade, their skills for products or services offered by a
website owner as a means of building a portfolio.
CLASSROOM ACTIVITIES
1. Critical thinking: Ask students to look at FIGURE A-1 and have them list possible poor design
decisions that would have been made if the project plan for Lakeland Reeds B&B omitted some of the
information it includes.
2. Classroom Discussion: Have students brainstorm and list of all possible questions a web designer may
want to ask a client during a project plan meeting. Divide the questions into topics, such as goals and
objectives, target audience information, design preferences of the client, site type, and client
expectations.
4
4
4:
:
:
C
C
Cr
r
re
e
ea
a
at
t
te
e
e
W
W
Wi
i
ir
r
re
e
ef
f
fr
r
ra
a
am
m
me
e
es
s
s
a
a
an
n
nd
d
d
a
a
a
S
S
St
t
to
o
or
r
ry
y
yb
b
bo
o
oa
a
ar
r
rd
d
d
LECTURE NOTES:
• Explain to students that designers often use a wireframe, which is a sketch that outlines the
components of each web page, as well as their place in the layout, in order to get a clear idea of
what they are trying to build.
• Explain to students the concept of a storyboard for a website. Mention that a storyboard is used
when there are multiple pages for a site. Tell students, that like a wireframe, it outlines the
components of each page in the website and their layout, but that it also defines the links between
the pages in the website.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 4 of 15
• Explain that a first step to creating a wireframe and storyboard, which happens prior to any actual
coding, is identifying the various components and elements that the website should include. Many
of these are included in the project plan. Some elements may not be included in the project plan,
such as elements that are common to specific types of websites. Give examples for each type of
element.
TEACHER TIP
Point out that even if the website includes multiple pages having different layouts, it is
recommended that there be some common aspects to the various layouts. For example, even though
one page may include information and another page may be a picture gallery, both should provide
the same portion of the page for a page header and footer. This way, when a user navigates between
web pages in the website, certain aspects of the page seem fixed, which makes the transition
between pages easier for the user.
• Show that the next step is to map or storyboard the relationship between the web pages. The
storyboard can include pages that the web developer is creating as well as external websites. Explain
the importance of the relationship map in creating navigation tools for and within the website.
TEACHER TIP
Students may worry about their sketching abilities and think their sketch is aesthetically
displeasing. Point out that the storyboard is created for the web developer’s convenience and
efficiency of work, and does not need to be a work of art.
FIGURES: A-2, A-3
BOXES:
1. Quick Tip: Many common web page designs use columns that are about one third the width of the
page to approximate traditional aesthetic proportions.
2. Clues to Use: Creating a website from a template
An alternative to creating a layout for your website is to download a template, which is a generic layout
that includes a color scheme and element positions, but which uses placeholder images and text. Some
templates are available to download and use for free, while others must be purchased from the designer.
CLASSROOM ACTIVITIES
1. Quick Quiz:
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 5 of 15
2. Group Activity: Divide the classroom into small groups. Give each group a “project plan” for a
fictitious website, and ask them to design a wireframe and a storyboard for their assigned site.
LAB ACTIVITY
1. Ask students to go to a website of their choice and look at all the pages to identify the various
layouts. Do all the pages in the selected website have the same layout? If not, how do the different
layouts serve the purposes of the pages?
6
6
6:
:
:
C
C
Cr
r
re
e
ea
a
at
t
te
e
e
a
a
an
n
n
H
H
HT
T
TM
M
ML
L
L
D
D
Do
o
oc
c
cu
u
um
m
me
e
en
n
nt
t
t
LECTURE NOTES
• Explain that an HTML document consists solely of text, and that HTML code does not include any
images. As a result, an HTML document or web page can be written in any text editor.
• Illustrate that to create a web page students enter text that they want to display on the page, along
with tags which specify how a user agent should treat each item in the document.
• Explain that a tag pair assigns meaning to a web page element, which is a specific component of the
page. The opening tag is placed at the start of the element and the closing tag at the end. HTML tags
always start with an opening angle bracket (<) and end with a closing angle bracket (>). A closing
• Explain that to create a web page, one must define the document as being written in HTML by
using the DOCTYPE declaration <!DOCTYPE html>.
TEACHER TIP
In order for a web page to be rendered correctly in some web browsers, the DOCTYPE declaration
must be the first thing to appear on the web page.
• Point out that in order to write an html page, the contents of the page must be surrounded by
<html> tags. Therefore, advise students to always write these tags as a first step to creating their
document.
• Recommend to your students that for the clarity of their code, they should leave two lines of space
between the opening and closing html tags.
FIGURES: A-4, A-5
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 6 of 15
BOXES
1. Quick Tip: To write HTML in TextEdit on a Mac, you need to change two program preferences. Press
[command][,] to open the Preferences dialog box. On the New Document tab, click Plain text. On the
Open and Save tab, uncheck Add “.txt” extension to plain text files.
2. Trouble: If you don’t have the empty folder structure for storing this unit’s files, create a Lessons
folder within the drive and folder where you store your Date Files for Unit A, then save your file to the
Lessons folder.
3. Clues to Use: Using other web page creation software
Many other programs are available that allow you to create web pages visually by clicking buttons and
using drag-and-drop to place items on a page. However, creating your first web pages by entering
HTML directly—sometimes referred to as hand-coding—is one of the best ways to become familiar
with HTML and the underlying structure of a web page. Many professional developers use a code
4. Clues to Use: Understanding the difference between HTML and XHTML
Extensible Hypertext Markup Language (XHTML) is a version of HTML that conforms to the rules of
Extensible Markup Language (XML). Although most modern web documents are written in HTML,
some organizations require XML-compatible code, and therefore use XHTML instead of HTML. HTML
and XHTML have only a handful of differences, and utilities are available that can automatically
convert code from one to the other. In general, HTML syntax is less strict than XHTML code, and some
aspects of code that you can omit in HTML are required in XHTML code. Except where otherwise
stated, all the code you write in this book will conform to the rules of HTML.
CLASSROOM ACTIVITIES
1. Critical Thinking: Ask students to consider what would happen if someone wrote a web page
including an opening <html> tag, but forgot to add the corresponding closing tag. How would a user
agent treat the student’s web page?
8
8
8:
:
:
S
S
Se
e
et
t
t
U
U
Up
p
p
t
t
th
h
he
e
e
D
D
Do
o
oc
c
cu
u
um
m
me
e
en
n
nt
t
t
H
H
He
e
ea
a
ad
d
d
a
a
an
n
nd
d
d
B
B
Bo
o
od
d
dy
y
y
LECTURE NOTES
• Explain that each web page is divided into a head section, which contains elements that are not part
of the main web page, and a body section, the contents of which are visible in the main window of
the web browser.
• Explain the concept of nesting elements – some elements in an HTML page are included within
other elements. For example, both head and body tag pairs are located within the html tag pair.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 7 of 15
• Explain to students that adding spaces before a nested tag makes it appear indented, making
complex code easier to read and elements easier to identify.
• Introduce students to the meta element, which enables a web page author to pass information about
a web page to the user agent that opens it.
• Note that some HTML elements may include attributes, which specify details about a given
element’s properties. For example, the charset attribute specifies the character encoding, which is
the system the user agent should employ to translate the electronic information into human
recognizable symbols, such as letters and numbers.
TEACHER TIP
In order to make sure that all opening tags have corresponding closing tags, recommend that
whenever students write an opening tag they immediately write the closing tag, and only then add
the contents of the tag pair between the opening and closing tags.
FIGURES: A-6, A-7
BOXES
1. Quick Tip: To read more about any HTML tag used in this book, see Appendix A.
2. Quick Tip: To save your work without using the menus, you can press [Ctrl]+[S] (Windows) or
[command]+[S] (Mac).
3. Clues to Use: Describing nesting relationships
An element nested within another element is called a child element of the enclosing element, and the
enclosing element is known as the parent element. In the code shown in FIGURE A-6, the head
element is both a child of the html element and the parent of the title element. In addition, the html
CLASSROOM ACTIVITIES
1. Classroom Activity: Using FIGURE A-6, have students point out opening and closing tags in the
figure. Discuss what information is enclosed by each pair of tags. Have students predict what each tag
stands for, some are obvious such as <head> but others may not be as obvious to students, such as <tr>
for table row. Point out how <tr> is nested in the <table> tag and how the <table tag> provides a clue as
to the meaning of the <tr> tag. Discuss how the indenting of code is similar in structure to a document
outline.
2. Critical Thinking: Based on their personal experience with other languages/systems, ask students to
think about the advantages of splitting a web page into head and body sections.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 8 of 15
1
1
10
0
0:
:
:
A
A
Ad
d
dd
d
d
T
T
Te
e
ex
x
xt
t
t
t
t
to
o
o
a
a
a
W
W
We
e
eb
b
b
P
P
Pa
a
ag
g
ge
e
e
LECTURE NOTES
• Explain that because an HTML document is a simple text document that includes HTML codes,
adding text to a web page is as simple as typing it and adding the appropriate HTML tags to specify
the relevant element type for each text item.
TEACHER TIP
Explain to students that sketching the layout of their website, using a piece of paper and a pen or a
word processing application, often helps determine how the various elements should be included in
a web page. Use this hands-on technique can also help find errors in the resulting web page.
• Show students that when adding text to a web page, they can also add surrounding elements, such
as the web page title that will appear in the user-agent title bar. Stress that these elements, such as
the title element, are part of the document’s head section because this element does not appear in
the main browser window.
FIGURES: A-8, A-9
TABLE A-1: HTML heading elements
BOXES
1. Quick Tip: If your code editor indents automatically, you will not need to add spaces, just be sure
that your insertion point is indented six spaces before entering the title element.
2. Trouble: If you’re using Notepad and can’t see all the text in the window at once, click Format on
the Menu bar, then click Word Wrap.
3. Clues to Use: Understanding the complementary roles of HTML and CSS
Browsers generally display the content of HTML elements such as h1 and p in ways that visually
distinguish the content. However, at its core, HTML is intended to indicate only the meanings of
elements such as headings and paragraphs in a web page, but not to tell web browsers how the
elements should appear. Instead, HTML has a companion language, Cascading Style Sheets (CSS),
CLASSROOM ACTIVITIES
1. Critical Thinking: Assume that you are looking at a web page that includes a heading, then a
paragraph of text, and then another heading. You want to change this web page to include only plain
paragraphs of text, with no headings. How many tags will you need to change in order to achieve this?
2. Quick Quiz:
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 9 of 15
1
1
12
2
2:
:
:
A
A
Ad
d
dd
d
d
a
a
a
C
C
Co
o
om
m
mm
m
me
e
en
n
nt
t
t
t
t
to
o
o
a
a
a
W
W
We
e
eb
b
b
P
P
Pa
a
ag
g
ge
e
e
LECTURE NOTES
• Explain to students that they can create text elements in their web page code that user agents
ignore.
• Tell students these elements, known as comments, are not rendered by user agents and are viewable
only by people who examine the HTML code of their web pages.
• Explain that comments can be especially helpful when they are creating or adding on to a large,
complex web document or website, or when other web developers will be working with their
code—now or in the future.
TEACHER TIP
Explain to students that it is considered best practice to include a comment in the head section of an
HTML document that includes the name of website, the filename, the author of the web page, the
date the web page was created, and another identifying information that other developers will find
useful when reviewing the document.
FIGURES: A-10, A–11
TABLE A-2: Basic web page elements
BOXES
1. Quick Tip: Adding extra spaces after the colon lines up your name with the filename in the previous
line of text, making the information easier to read.
2. Clues to Use: Understanding single-line and multi-line comments
An HTML comment can be either single-line or multi-line. A single-line comment includes the
opening tag, comment text, and closing tag on a single line. For instance, the following comment is
a single-line comment: <!— This page last updated 5/26/2018 —> By contrast, a multi-line comment
occupies multiple lines. In a multi-line comment, the opening and closing tags are often on their
own lines, and the content may occupy one or more additional lines, like the comment you created
in the steps in this lesson. The choice to use a single-line comment or a multi-line comment is
generally based on the amount of comment text you want to add to your document. A single-line
comment makes sense for a word or phrase, while using a multi-line comment can make it easier to
read a longer comment by breaking it up over multiple lines.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 10 of 15
CLASSROOM ACTIVITIES
1. Critical Thinking: In addition to the identifying information you might include in the head section of
your document, what other types of comments might you include in your document? Give some
examples.
2. Quick Quiz:
1
1
14
4
4:
:
:
P
P
Pr
r
re
e
ev
v
vi
i
ie
e
ew
w
w
Y
Y
Yo
o
ou
u
ur
r
r
W
W
We
e
eb
b
b
P
P
Pa
a
ag
g
ge
e
e
o
o
on
n
n
a
a
a
D
D
De
e
es
s
sk
k
kt
t
to
o
op
p
p
C
C
Co
o
om
m
mp
p
pu
u
ut
t
te
e
er
r
r
LECTURE NOTES:
• Explain the importance of previewing a web page as an aid in finding errors in the code before
publishing the page.
• In order to understand how code will be rendered in different web browsers, stress that it is
advisable to preview a web page in multiple user agents, since the interpretation of the code may
vary.
• Show students that in order to preview a web page in their default web browser, they have to use
their file manager to find the web page they wish to preview, and double click the name of the
relevant .html file.
• Show students that in order to preview a web page in a non-primary web browser they need to
return to the file manager, and right-click (Windows) or control-click (Mac) the name of the
relevant .html file, point to “Open with” and then click the selected browser name. Alternatively,
• Explain that if the web page being previewed is not rendered correctly, it can be edited in their text
editor, saved, and previewed again, until it looks correct.
TEACHER TIP
Stress to students that in order for changes made to the source HTML to take effect, the web page
must be refreshed or re-opened in the web browser.
FIGURES: A-12, A–13
BOXES:
1. Trouble: If your web page does not match FIGURE A-12, return to your editor, compare your code to
FIGURE A-11, edit as necessary, and save the file, then repeat Step 1 to preview your edited web page.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 11 of 15
2. Clues to Use: Understanding the effect of browser extensions on page rendering
Modern browsers are highly customizable, allowing users to install new features and modify default
settings. One common way of customizing a browser is to install an extension, which is a small
application that changes the way web pages are rendered or integrates features with the content of a
web page. Some of the most common extensions stop video or audio from loading and playing
automatically on a web page, or enable web developers to examine or change the code of a web
document. Some extensions may highlight or underline text or add icons to web page text rendered
in the browser window. It’s important to understand that these changes are not part of the web page
3. Clues to Use: Why browsers display web pages differently
The display of web pages in HTML5 starts with the specifications maintained by groups such as the
World Wide Web Consortium (W3C), an organization that helps build consensus around changes
and additions to the language, and publishes descriptions of the current standards. The standards list
and describe all the available elements, along with parameters for how browsers should handle
them. Browsers are built around software known as rendering engines that translate web page
elements into visual, auditory, or tactile representations based on these standards. Because the
CLASSROOM ACTIVITIES
1. Quick Quiz:
2. Class Discussion: Look at FIGURE A-13, and discuss why certain elements of the Illustrated web page
are rendered identically in the different browsers, while other elements are portrayed differently in the
different browsers.
LAB ACTIVITY
1. Select a web page of your choice, and open it in two different web browsers. Identify the elements of
the web page that are different between the different web browsers.
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 12 of 15
1
1
16
6
6:
:
:
C
C
Co
o
on
n
nf
f
fi
i
ig
g
gu
u
ur
r
re
e
e
W
W
We
e
eb
b
b
S
S
Se
e
er
r
rv
v
ve
e
er
r
r
S
S
So
o
of
f
ft
t
tw
w
wa
a
ar
r
re
e
e
LECTURE NOTES:
• Define a web server: a computer optimized to store and share web documents with an extremely
high speed Internet connection.
• Explain to students a web server is needed to open web documents from their computer on another
device.
TEACHER TIP
Stress to students that they will need to research web server software to determine which meets their
needs but that for the purposes of this book the free web server software available with Aptana Studio 3
will meet their needs.
FIGURES: A-14, A-15
BOXES:
1. Quick Tip: The IP address 127.0.0.1 is a special value that’s accessible only on the current computer.
Any other value in the list will also be accessible to other devices on the same network.
2. Clues to Use: Understanding Web Servers
Creating and saving a web page on your computer is not sufficient to make it available to all web
users. Every web page accessible on the web is located on a web server, which is a computer that is
running web server software and that is always connected to the Internet. Although someone who’s
technologically proficient can configure a personal web server in their home or business, most public
websites are made available on dedicated web servers that are maintained by teams of professionals
and connected to the Internet with high capacity connections. Many companies run web servers and
sell space on them for a monthly fee. When you create a web page that you want to make publicly
available on the web, you must first secure space on a web server and upload your files to that web
server.
CLASSROOM ACTIVITIES
1. Quick Quiz:
2. Critical Thinking: Why are most websites available on dedicated web servers that are monitored and
maintained by professionals?
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 13 of 15
1
1
18
8
8:
:
:
P
P
Pr
r
re
e
ev
v
vi
i
ie
e
ew
w
w
Y
Y
Yo
o
ou
u
ur
r
r
W
W
We
e
eb
b
b
P
P
Pa
a
ag
g
ge
e
e
o
o
on
n
n
M
M
Mo
o
ob
b
bi
i
il
l
le
e
e
D
D
De
e
ev
v
vi
i
ic
c
ce
e
es
s
s
LECTURE NOTES:
• Remind students that earlier they learned how important it is to test their web page using multiple
user agents.
• Explain that it is also important to test their web pages using multiple devices, including mobile
devices, especially because so many web users today are accessing the web via their mobile devices
such as smartphones and tablets.
TEACHER TIP
Explain to students that this lesson will help them set up web server software so that as they
continue through the units, they can use this web server software to test their web pages on other
devices they connect to their computer. Point out that they may want to tag this lesson so that they
can easily refer back to it as needed when working through future lessons.
• Emphasize that that these steps are for the web server software that comes with Aptana Studio 3,
and that, if they are using different web server software, they will need to use the instructions that
came with that software to configure it for use with these steps .
FIGURES: A-16, A-17, A-18
BOXES:
1. Quick Tip: All files and folders within the folder you specify as a project are accessible using the
web server.
2. Quick Tip: You can copy the address from the Address bar, paste it in an email, and email
yourself the address. Next, access your email on your mobile device, then click the address to
open it in the browser on your mobile device.
3. Clues to Use: Testing web documents on mobile devices
4. As people increasingly access the web using mobile devices, it’s important to test your content
on the mobile devices used by your audience. Most users accessing the web on a mobile device
use either Safari (on Apple iOS devices such as the iPhone and iPad) or Chrome (on Google
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 14 of 15
CLASSROOM ACTIVITY
1. Quick Quiz:
E
E
En
n
nd
d
d
o
o
of
f
f
U
U
Un
n
ni
i
it
t
t
M
M
Ma
a
at
t
te
e
er
r
ri
i
ia
a
al
l
l
•
•
•
Concepts Review – Includes screen identification, multiple choice, and matching questions.
•
•
•
Skills Review – Provides additional hands-on exercises that mirror the progressive style of the
lesson material.
•
•
•
Independent Challenges 1, 2 and 3 – Case projects that require critical thinking and application of
the unit skills. The Independent Challenges increase in difficulty, with the first being the easiest
(with the most step-by-step detailed instructions). Independent Challenges 2 and 3 become
increasingly more open-ended.
G
G
Gl
l
lo
o
os
s
ss
s
sa
a
ar
r
ry
y
y
o
o
of
f
f
K
K
Ke
e
ey
y
y
T
T
Te
e
er
r
rm
m
ms
s
s
body section (8)
cascading style sheet (CSS) (10)
child element (9)
clients (16)
code editor (6)
comment (12)
design document (2)
DOCTYPE declaration (6)
Extensible Hypertext Markup Language
(XHTML) (7)
Extension (14)
grandchild element (9)
grandparent element (9)
hand-coding (6)
head section (8)
Hypertext Markup Language (HTML) (6)
multi-line comment (12)
Nested (8)
one-sided tag (6)
parent element (9)
preview (14)
project plan (2)
rendering engine (15)
HTML5 and CSS 3 – Illustrated 2nd Ed. Instructor’s Manual: Unit A Page 15 of 15
sibling element (9)
single-line comment (12)
storyboard (4)
tag (6)
web server (16)
web server software (16)
website (2)
wireframe (4)
template (5)
web (2)
web page (2)
World Wide Web (2)
World Wide Web Consortium (W3C) (14)