CMT-111: HTML & Dreamweaver

This course teaches the student the principles and concepts of designing and creating WEB pages in an HTML format. The course is designed to expose the student to the constructs of HTML tags, the attribute modification of HTML tags, the incorporation of CSS tags, CSS pseudo tags, dynamic effects using styles, and class assignments. Additionally, the course will teach the student the utilization of graphics and dynamic graphics used in Web design. Also included will be content presentation control via HTML tables, HTML layers, and HTML frames. The course will explore the requirements, tools and controls used in WEB page development by lecture, in-class practical exercises, and home study exercises. The course will also teach the student to create WEB sites using Dreamweaver as a state-of-the-art web authoring tool to enable rapid deployment of WEB development projects. Register for this class at BHCC website.


Sample Class Syllabus: click here.



This chapter introduces students to the concept and terms that are needed to work with HTML and CSS. After completing this chapter, students will have the background needed for learning how to build web sites.


How Web Applications Work
An Introduction to HTML and CSS
Tools for Web Development
How to View Deployed Web Pages
Three critical Web Development Issues


1.1 Creating Website Directory Folders


This chapter reviews how to create and edit HTML and CSS files, how t test those files and to make sure they work correctly. Students will also learn how to validatre the code in students to the concept and terms that are needed to work with HTML and CSS. After completing this chapter students will be able to code, test and validate HTML and CSS files to make sure that the file doesn't contain errors.


The HTML Syntax
The CSS Syntax
Using a Code Editor to work with HTML and CSS files
How to Test, debug, and validate HTML and CSS files


2.1 Planning A Website

2.2 Creating Your First Website


Additional Resouces
W3C Validation Service for HTML
W3C Validation Service for CSS



This chapter focuses on how to code the HTML elements that you'll use in most of the documents you create. After completing this chapter, students will know how to properly setup the structure of a Web page, create the head section, code the text elements and create the structure for the body element using HTML5 semantic elements. Students will also create links, list and include images on their website and review site folder setup.


How to Code the Head Section
How to Code text elements
How to structure the content of a page
How to code links, list, and images


Lab: How to Use HTML to Structure a Web Page
Lab 3.1 Habitat for Humanity
Lab 3.2 Colorado Mountain Family Resort


This chapter will look at how to code the CSS rule sets that determine how the page is formatted. Students will learn how to code selectors, and how to code the properties and values for rule sets. After completing this chapter students will be able to code all types of selectors, and how to apply the CSS properties for formatting text.


An Introduction to CSS
How to Specify Meaurements and Colors
How to Code Selectors
How to Work with Text


4.1 Adding CSS to the Habitat for Humanity Website
4.2 Adding CSS to the Colorado Mountain Family Resort Website


This chapter will build on the CSS that was presented in the previous chapter and focus on the properties for controlling the spacing between elements and for displaying borders and backgrounds. After completing this chapter students will be able apply how to use the CSS box model for those purposes.


An Introduction to the Box Model
How to Size and Space Elements
A Web Page that Illustrates Sizing and Spacing
How to Set Borders and Backgrounds


5.1 How to Apply the CSS Box Model to the Habitat for Humanity Page
5.2 Applying the Box Model to Colorado Mountain Family Resort


This chapter will focus on how to use CSS to control the layout of a page. You will be able to control where each of the HTML elements appear on a page. After completing this chapter students will be able to implement 2- and 3-column page layouts.


How to Float Elements in 2- and 3-Column Layouts
Two Web Pages That Use a 2-Column, Fixed-Width Layout
How to Use CSS to Create Text Columns
How to Position Elements


6.1 How to Use CSS for Page Layout Habitat for Humanity

6.2 How to Use CSS for Page Layout Colorado Mountain Family Resort


This chapter build on the skills that were introduced in previous Lessons. Students will review those skills and then expand on them by learning how to create Navigation Lists and Bars and how to create placeholder links (also known as jump links).


How to Code Lists
How to Format Lists
How to Code Links
How to Create Navigation Lists and Bars


7.1 Habitat for Humanity – Adding Lists and Links
7.2 Colorado Mountain Family Resort –Adding Lists and Links


The Midterm Project is design for students to take the skills they have learned in the first 7 Chapters and create an HTML 5 Web Site to showcase their knowledge.


Midterm Project Phases
Research the Site Topic
Creating a Storyboard
Creating a Wireframe
Building the site
Peir Review and Presentations
Sample Site


Chapter 8 focuses on Responsive Web Design. By using Responsive Web Design in the development of a web site the page will automatically resize to the device that is accessing the information.


Using Responsive Design


8.1 Responsive Web Design Habitat for Humanity


This chapter will look at the three common formats for images, how to adjust the size of an image using attriutes and applying CSS to for alignment with the aid of block elements. This chapter will also look at new HTML5 image elements and how to apply them. Finally, we will look at creating thumbnails, image rollovers and image mapping.


Basic Skills for Working with Images
Advanced Skills for Working With Images
Related Skills for Working With Images


9.1 How to Work with Images


This chapter will look at how HTML5 has changed the way tables are used on the page. Tables are still an important element but are no longer used to create the structure of the page. Tables are now used to display tabular data and present information. After creating tables we will look how to apply CSS for formatting and how to make them accessable to visually impared users.


Basic skills for using tables
Other skills working with tables


10.1 How to work with tables

This chapter will look at how to create a dynamic web page using HTML5 to crate forms that let the user enter data. Then, the user can click on a button to submit the data to a web server for processing. In this chapter, students will learn how to code forms and the controls they contain. We will also examin the new HTML5 features for data validation and how to use the new HTML5 controles.


How to Use Forms and Controls
Other Skills for Working With Forms
How to Use the HTML Features for Data Validation
How to Use the HTML5 Controls


11.1 HFH Forms
11.2 CMFR Forms


An introduction to media on the web
How to add audio and video to a web page
A web page that offers both audio and video


12.1 Adding Media to the HFH site
12.2 Adding Media to the CMFR site

Student ePortfolio Project


Lab Samples

Habitat for Humanity

Colorado Mountain Family Resort

Midterm Project

Sample ePortfolio


Student Sites

Fall 2016

Spring 2016

Find Jeannette on Social Media

  • Facebook Facebook
  • LinkedIn LinkedIn
  • YouTube YouTube
  • Follow @jrpassanisi Twitter