[go: up one dir, main page]
Scribd
Upload
89 views4 pages

Dreamweaver 2021 D3 L1 Projects

Domain 3 Lesson 1 focuses on configuring assets and organizing webpage structure using the Document Object Model (DOM) panel in Dreamweaver. It covers the importance of HTML tags, media queries in CSS3 for responsive design, and the hierarchical organization of content on a webpage. The lesson includes fill-in-the-blank exercises and specific steps for editing and applying styles for multiple devices.

Uploaded by

ahawkins1030
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
89 views4 pages

Dreamweaver 2021 D3 L1 Projects

Domain 3 Lesson 1 focuses on configuring assets and organizing webpage structure using the Document Object Model (DOM) panel in Dreamweaver. It covers the importance of HTML tags, media queries in CSS3 for responsive design, and the hierarchical organization of content on a webpage. The lesson includes fill-in-the-blank exercises and specific steps for editing and applying styles for multiple devices.

Uploaded by

ahawkins1030
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Domain 3 Lesson 1

28 | Domain 3 Lesson 1: Configure Assets Dreamweaver Project Workbook, First Edition


Fill-in-the-Blanks
Instructions: While watching Domain 3 Lesson 1, fill in the missing words according to the information
presented by the instructor. [References are found in the brackets.]

1. With very few exceptions, each tag has to have an tag and a tag.
[View, Edit, and Manage Structure]

2. If we look over in our Document Object models panel, we can see the hierarchical structure of our
document. [View, Edit, and Manage Structure]

3. Media quieres were introduced in CSS3 and are a way to apply different styles for different media types
and devices. [Design for Multiple Devices]

4. Pixels are a(n) abstract unit of measurement, but they are also relative to the resolution
of the viewing device. [Design for Multiple Devices]

41 | Domain 3 Lesson 1: Fill-in-the-Blanks Dreamweaver Project Workbook, First Edition


View, Edit, and Manage Project Details
Project file
Structure products.html

Estimated completion time


Content on a webpage is organized in a hierarchy. This is important in HTML page 5 minutes
structure and design files. The Document Object Model (DOM) panel will display Video reference
the hierarchal structure of the document. The DOM panel is found in the bottom Domain 3
of the panel groups next to the Assets panel. Topic: Organize Page Structure
Subtopic: View, Edit, and Manage
Purpose: Structure

Upon completing this project, you will know how to set up, view, and edit the Objectives covered
structure of a webpage using the DOM panel. 3 Organizing Content on a Page
3.1 Organize page structure
Steps for completion: 3.1 a View, edit, and manage the
structure of a page
1. Open the products.html file.

2. What is the first tag that nests all of the webpage’s elements?

3. What tag will apply our site template?

4. (True or False) HTML can be added directly from the DOM panel.

5. How can you insert a tag before an HTML element using the DOM panel?

6. What option would you select to insert a tag inside of an HTML element using the DOM panel?

42 | Domain 3 Lesson 1: View, Edit, and Manage Structure Dreamweaver Project Workbook, First Edition
Design for Multiple Devices Project Details
Project file
Cascading Style Sheets (CSS) makes a webpage mobile friendly. A media query is products.html
a way to create CSS formatting that only applies to specific types of media. style.css

Purpose: Estimated completion time


5 minutes
Upon completing this project, you will understand how to use media queries to Video reference
create specific CSS formatting that make a web design useable on multiple types Domain 3
of devices. Topic: Responsive and Adaptive
Design
Steps for completion: Subtopic: Design for Multiple
Devices
1. Open the products.html file and switch to Code view.
Objectives covered
2. Select the style.css file. 3 Organizing Content on a Page
3.2 Apply responsive and adaptive
3. What does a media query always start with? design concepts
3.2 a Design a web page that
4. What does a media query do? works well on multiple devices

5. What measurement types can be use in media queries?

6. Screen sizes are measured in , so this is the preferable measurement when creating a multiple
device design.

43 | Domain 3 Lesson 1: Design for Multiple Devices Dreamweaver Project Workbook, First Edition

You might also like