In this engaging, web-based title, students become web designers as they learn basic HTML code. Using step-by-step instructions, students edit a web page, write code to include pictures and hyperlinks, upload and share web pages, and more. This title also includes templates and review questions to help students become familiar with HTML.
From formatting titles and headings with CSS, to creating a web page using HTML and styling it with CSS, students learn a number of key web programming skills. HTML5 Coding for Beginners is designed to spark students’ interest and increase their confidence in writing web-based code.
Students Will:
- Identify the topic, purpose, and audience of a web page
- View the source code of a web page
- Decode the meaning of HTML and CSS tags
- Plan and organize web page ideas
- Create a web page using HTML and style it with CSS
- Set attributes for the body, text, and graphics
- And More!
Benefits & Features
- Includes easy-to-follow, self-paced projects that help students become web designers as they learn basic HTML code
- Students learn how to identify the topic, purpose, and audience of a web page and learn how to plan and organize web page ideas
- All Assignments Submitted Online (from Student Portal to Instructor Portal)
- No textbooks or paper required
Activity 6
Edit an HTML Document
Activity 9
Start Building a Web Page
Activity 10
Format the Web Page using CSS
Activity 12
Add Images and Format the Style
Activity 14
Explore Meta Tags
Included with Your Purchase
- 24/7 access from anywhere, any device
- Printable marking sheets
Specifications
Grade: 6-8, 9-12
Item #: TB-HTML5-iA
ISBN: 978-1-626891-59-3
Author: Created and Published by TechnoKids in Partnership with B.E. Publishing
Introduction
Introduction
HTML5 Coding for Beginners
HTML and CSS Reference Sheet
Unit 1: Seek the Source
Activity 1
Internet Basics
View Skills
Skills
-
define the terms network, lan, wan, and Internet
-
list the ways the Internet is used
Activity 2
History of the Internet
View Skills
Skills
-
recognize key events in the history of the Internet
Activity 3
About the World Wide Web
View Skills
Skills
-
recognize the role of a web browser
-
type a url into the Address Bar
-
click on hyperlinks
-
define World Wide Web, hyperlink, url, and browser
Activity 4
About HTML
View Skills
Skills
-
define HTML
-
understand the importance of HTML
-
view the content and source code of a web page
Free Lesson
This lesson is available for a free preview. We'd love to know what you think!
Activity 5
Seeking the Source
View Skills
Skills
-
decode the meaning of HTML tags
Unit 1 Review
Internet Terminology
Unit 1 Review
The Internet and HTML
Unit 1 Extension Activity
Analyze Websites
Unit 2: Crack the Code
Activity 6
Edit an HTML Document
View Skills
Skills
-
understand the function of HTML tags
-
open and close a file in a program
-
save changes to a document
-
toggle between two open windows
-
edit the title of a web page
-
edit the <h1> heading tag
-
insert a subheading using the <h2> tag
-
insert a new paragraph using the <p> tag
-
force text onto a new line using the break <br> tag
-
create a horizontal rule to divide content into thematic breaks using the <hr> tag
-
replace a picture by editing the image *ltimg> tag
-
edit the text used in a hyperlink
Free Lesson
This lesson is available for a free preview. We'd love to know what you think!
Activity 7
Edit the Style of a Web Page
View Skills
Skills
-
understand the function of HTML tags
-
understand the function of CSS attributes
-
recognize the purpose of CSS in the head
-
recognize the purpose of CSS in the body
-
edit HTML tags for an element
-
edit CSS attributes for a style
-
open and close a file in a program
-
view the source code of a web page
-
refresh the browser window
-
set body background color
-
set the font color using words & hex codes
-
set the body width in pixels
-
set the horizontal rule width in pixels
-
set the font family using web safe fonts
-
set the font size of text using percent
-
set the line height of a paragraph using percent
-
set text alignment of elements: left, center, or right
-
set image alignment float: left or right
-
set padding to add space in pixels
Activity 8
Plan a Web Page
View Skills
Skills
-
plan and organize ideas for a web page
-
save a picture from a web page to a folder
-
use the internet to research topic
-
collect information about topic
-
record URLs for reference
Unit 2 Review
About HTML and CSS
Unit 2 Skill Review
Jazz Up a Web Page
Unit 2 Extension Activity
Format Lists
Unit 3: Begin Web Page Building
Activity 9
Start Building a Web Page
View Skills
Skills
-
create a web page using HTML
-
create the structure of an HTML document
-
validate the web page using the <title> tag
-
insert a web page title using a heading <h1>> tag
-
insert a subheading using the <h2> tag (optional)
-
insert a new paragraph using the <p> tag
-
create a horizontal rule using the <hr> tag
-
save a document as an HTML file
-
open and close a file
-
write about a topic of your choice
-
present ideas in a logical manner
Free Lesson
This lesson is available for a free preview. We'd love to know what you think!
Activity 10
Format the Web Page using CSS
View Skills
Skills
-
format the style of CSS elements
-
set the background color of the body
-
set the body width in pixels
-
set the horizontal rule width in pixels
-
set the body margin automatically center
-
set the font family using web safe fonts
-
set the font size of text using percent
-
set the font color of text using words and hex codes
-
set text alignment of elements: left, center, or right
-
set padding to create space around elements
-
set the line height of a paragraph using percent
-
set the horizontal rule style
-
save a document as an HTML file
-
refresh the browser window
Free Lesson
This lesson is available for a free preview. We'd love to know what you think!
Unit 3 Review
Build a Web Page Quiz
Unit 3 Skill Review
Start a Web Page
Unit 3 Extension Activity
Add a Background Image
Unit 4: Add Images and Hyperlinks
Activity 11
Prepare Your Images
View Skills
Skills
-
use media to enhance a message
-
change the folder view
-
resize a photo (optional)
Activity 12
Add Images and Format the Style
View Skills
Skills
-
view the source code of a web page
-
refresh the browser window
-
insert a picture using the img element
-
format the style of the elements using CSS
-
set the alternate text for a picture
-
format the style of the img element
-
set text wrap around an image
-
set the margin around an image in pixels
-
position an image in the center of the page
-
set image border style, width, and color (optional)
-
troubleshoot layout issues
-
produce an effective publication
Free Lesson
This lesson is available for a free preview. We'd love to know what you think!
Activity 13
Create Hyperlinks
View Skills
Skills
-
insert a text hyperlink
-
activate a hyperlink
-
insert a hotspot
-
return to a previously viewed page in the browser
Unit 4 Review
About Images and Hyperlinks
Unit 4 Skill Review
Add Images and Hyperlinks
Unit 4 Extension Activity 1
Format the Hyperlink Style
Unit 4 Extension Activity 2
Create a Class
Unit 5: Include Meta Tags
Activity 14
Explore Meta Tags
View Skills
Skills
-
recognize the role of metadata
-
examine search engine results
-
view the source code of a web page
-
toggle between open windows
-
study metadata in an HTML document
Free Lesson
This lesson is available for a free preview. We'd love to know what you think!
Activity 15
Add Meta Tags to a Web Page
View Skills
Skills
-
generate metadata
-
add a meta tag for keyword and description
Activity 16
Web Page Checklist
View Skills
Skills
-
assess design, layout, and content
-
edit design, layout, and content
Unit 5 Review
About Meta Tags
Unit 5 Extension Activity 1
Add Animated Text and Images
Unit 5 Extension Activity 2
Build a Table
Unit 6: Upload the Web Page
Activity 17
Upload Your Web Page
View Skills
Skills
-
upload a web page
-
view a web page on the Internet
-
register for a free web hosting account (optional)
Activity 18
HTML Developers Conference
View Skills
Skills
-
share a web page
-
examine web pages
Unit 6 Review
Reflection
Unit 6 Extension Activity
Submit your Site
Unit 7: Skills Summary and Marking Sheet
Skill Summary
Web Page Marking Sheet
