Presentation is loading. Please wait.

Presentation is loading. Please wait.

Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Dreamweaver Domain 5: Organizing Content by Using Dreamweaver CS5 Adobe Creative Suite 5 ACA.

Similar presentations


Presentation on theme: "Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Dreamweaver Domain 5: Organizing Content by Using Dreamweaver CS5 Adobe Creative Suite 5 ACA."— Presentation transcript:

1 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Dreamweaver Domain 5: Organizing Content by Using Dreamweaver CS5 Adobe Creative Suite 5 ACA Certification Preparation: Featuring Dreamweaver, Flash, and Photoshop 111

2 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objectives Set and modify document properties. Organize web page layout with relative and absolutely positioned div tags and CSS styles. Modify text and text properties. Modify images and image properties. Create web page templates. 222

3 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objectives (cont.) Use basic HTML tags to set up an HTML document, format text, add links, create tables, and build ordered and unordered lists. Add head content to make a web page visible to search engines. Use CSS to implement a reusable design. 333

4 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Vocabulary absolute positioning AP div tag CSS layout block definition list div tag editable optional region editable region external style sheet fixed positioning font family HTML optional region ordered list 444

5 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Vocabulary (cont.) relative positioning repeating region round-trip editing static positioning template unordered list 555

6 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Domain 5.0 Organizing Content by Using Dreamweaver CS5 The fifth domain of the Web Communicationcertification focuses on organizing thecontent on your website. The fifth domain of the Web Communication certification focuses on organizing the content on your website. 666

7 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.1 Set and Modify Document Properties The Page Properties dialog box allows you toset document properties, which globallyaffect the active document. The Page Properties dialog box allows you to set document properties, which globally affect the active document. You can modify both HTML and CSSproperties in the Page Properties dialog box. You can modify both HTML and CSS properties in the Page Properties dialog box. The Page Properties dialog box providesoptions to specify layout and formattingproperties. The Page Properties dialog box provides options to specify layout and formatting properties. 777

8 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.2 Organize Web Page Layout with Relative and Absolutely Positioned Div Tags and CSS Styles A div tag is an HTML tag used as thefoundation of a CSS page layout to organizecontent on a web page by defining areas orsections. A div tag is an HTML tag used as the foundation of a CSS page layout to organize content on a web page by defining areas or sections. Static positioning is the default setting andpositions elements according to the standardflow of the page. Static positioning is the default setting and positions elements according to the standard flow of the page. Fixed positioning describes positioning relative to the browser window. 888

9 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.2 Organize Web Page Layout with Relative and Absolutely Positioned Div Tags and CSS Styles (cont.) Absolute positioning is used when items arepositioned using x- and y-coordinates and areremoved from the standard flow of the page. Absolute positioning is used when items are positioned using x- and y-coordinates and are removed from the standard flow of the page. Relative positioning is positioned by specifyingdistance from other elements on the page. Relative positioning is positioned by specifying distance from other elements on the page. The position of an AP div tag does not adjust on thepage according to the size of the browser window,and when opened in a browser, its location is relativeto the upper-left corner of the page. The position of an AP div tag does not adjust on the page according to the size of the browser window, and when opened in a browser, its location is relative to the upper-left corner of the page. 999

10 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.3 Modify Text and Text Properties A font family provides a list of alternative fonts; if thefirst font is not available, it will try the next font in thelist. A font family provides a list of alternative fonts; if the first font is not available, it will try the next font in the list. You can select text and then apply a bulletedUnordered List or a numbered Ordered List usingbuttons on the HTML Property inspector. You can select text and then apply a bulleted Unordered List or a numbered Ordered List using buttons on the HTML Property inspector. A Definition List is used for definitions or descriptions,and does not have a leading character. A Definition List is used for definitions or descriptions, and does not have a leading character. The CSS Property inspector provides additional optionsnot available on the HTML Property inspector. The CSS Property inspector provides additional options not available on the HTML Property inspector. 10

11 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.4 Modify Images and Image Properties Dreamweaver offers options to edit and modifyimages using tools on the Image Property inspector. Dreamweaver offers options to edit and modify images using tools on the Image Property inspector. Dreamweaver has a round-trip editing feature thatlets you edit an asset from a Dreamweaverdocument in an image-editing application such asFireworks or Photoshop, or a SWF file created inFlash. Dreamweaver has a round-trip editing feature that lets you edit an asset from a Dreamweaver document in an image-editing application such as Fireworks or Photoshop, or a SWF file created in Flash. You can add extensions and assign external editorsto files in the File Types/Editors category of thePreferences dialog box. You can add extensions and assign external editors to files in the File Types/Editors category of the Preferences dialog box. 11

12 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.5 Create Web Page Templates A template is a master page used to createmultiple pages from the same layout. A template is a master page used to create multiple pages from the same layout. Editable regions are the areas of the pagethat can be modified. Editable regions are the areas of the page that can be modified. A repeating region is a section of thetemplate that can be copied multiple times ina template-based page, to provideconsistency of sections that will be repeated. A repeating region is a section of the template that can be copied multiple times in a template-based page, to provide consistency of sections that will be repeated. 12

13 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.5 Create Web Page Templates (cont.) An optional region provides some flexibility whendesigning a page from a template; it allows you toshow or to hide this region when editing a pagebased on the template. An optional region provides some flexibility when designing a page from a template; it allows you to show or to hide this region when editing a page based on the template. An editable optional region allows content in anoptional region to be modified and you can choosewhether to include the region in the web page. An editable optional region allows content in an optional region to be modified and you can choose whether to include the region in the web page. Once you create a template, you can use it to create another page. 13

14 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.6 Use Basic HTML Tags to Set Up an HTML Document, Format Text, Add Links, Create Tables, and Build Ordered and Unordered Lists HTML stands for Hypertext MarkupLanguage and uses markup tags to createweb pages. HTML stands for Hypertext Markup Language and uses markup tags to create web pages. When writing HTML, it is important tounderstand the syntax that is requiredbecause a simple error in syntax can keepelements on your page from appearingcorrectly. When writing HTML, it is important to understand the syntax that is required because a simple error in syntax can keep elements on your page from appearing correctly. 14

15 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.7 Add Head Content to Make a Web Page Visible to Search Engines The head element of a web page contains contentthat is sent to the browser, but not displayed to theuser within the page. The head element of a web page contains content that is sent to the browser, but not displayed to the user within the page. You can use the tag selector, which is located in thestatus bar at the bottom of the document window, toselect, edit, or remove tags without leaving Designview. You can use the tag selector, which is located in the status bar at the bottom of the document window, to select, edit, or remove tags without leaving Design view. You can click the Head button on the Commoncategory of the Insert panel to quickly work with thebase, link, and meta tags. You can click the Head button on the Common category of the Insert panel to quickly work with the base, link, and meta tags. 15

16 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.8 Use CSS to Implement a Reusable Design Selecting a Dreamweaver CSS Starter Layout isthe easiest way to create a page with a CSSlayout. Selecting a Dreamweaver CSS Starter Layout is the easiest way to create a page with a CSS layout. CSS are a group of formatting rules that controlthe appearance of the content in a web page. CSS are a group of formatting rules that control the appearance of the content in a web page. An external style sheet is its own data file withthe.css file extension, which you attach to theHTML file using the Attach Style Sheet button inthe CSS Styles panel. An external style sheet is its own data file with the.css file extension, which you attach to the HTML file using the Attach Style Sheet button in the CSS Styles panel. 16

17 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.8 Use CSS to Implement a Reusable Design (cont.) Styles that are applied to text using either theProperty inspector or menu commandscreate CSS rules. Styles that are applied to text using either the Property inspector or menu commands create CSS rules. If you make formatting changes to text usingoptions on the CSS Property inspector,Dreamweaver opens the New CSS Ruledialog box, prompting you to name a newrule for those changes. If you make formatting changes to text using options on the CSS Property inspector, Dreamweaver opens the New CSS Rule dialog box, prompting you to name a new rule for those changes. 17

18 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Objective 5.8 Use CSS to Implement a Reusable Design (cont.) In Live view, you can click the Inspect buttonto quickly identify HTML elements and therelated CSS style. In Live view, you can click the Inspect button to quickly identify HTML elements and the related CSS style. A CSS layout block includes div tags,images assigned with either an absolute orrelative position, a tag with the display:blockstyle assigned, or a paragraph with anabsolute or relative position assigned to it. A CSS layout block includes div tags, images assigned with either an absolute or relative position, a tag with the display:block style assigned, or a paragraph with an absolute or relative position assigned to it. 18

19 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Summary 5.1 Set and modify document properties. 5.2 Organize web page layout with relative and absolutely positioned div tags and CSS styles. 5.3 Modify text and text properties 5.4 Modify images and image properties 5.5 Create web page templates. 19

20 Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Summary 5.6 Use basic HTML tags to set up an HTML document, format text, add links, create tables, and build ordered and unordered lists. 5.7 Add head content to make a web page visible to search engines 5.8 Use CSS to implement a reusable design. 20


Download ppt "Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Dreamweaver Domain 5: Organizing Content by Using Dreamweaver CS5 Adobe Creative Suite 5 ACA."

Similar presentations


Ads by Google