We think you have liked this presentation. If you wish to download it, please recommend it to your friends in any social system. Share buttons are a little bit lower. Thank you!
Presentation is loading. Please wait.
Published byJulia Anthony
Modified over 5 years ago
© 2011 Delmar, Cengage Learning Chapter 2 Developing a Web Page
Chapter 2 Lessons 1.Create head content and set page properties 2.Create, import, and format text 3.Add links to web pages 4.Use the History panel and edit code 5.Modify and test web pages © 2011 Delmar Cengage Learning Chapter 2 Lessons
Introduction Use white space effectively. Limit media elements. Keep it simple. Use an intuitive navigation structure. Apply a consistent theme. © 2011 Delmar Cengage Learning Developing a Web Page
© 2011 Delmar Cengage Learning Developing a Web Page Tools You’ll Use
© 2011 Delmar Cengage Learning Head content includes the page title that appears in the title bar of the browser. Meta tags are HTML codes that include information about the pages. Keywords are words that relate to the content of the website. Create Head Content and Set Page Properties
© 2011 Delmar Cengage Learning A description is a short paragraph that describes the content and features of the website. The body is the part of the page that appears in a browser window. Create Head Content and Set Page Properties
© 2011 Delmar Cengage Learning When you are designing a web page, you should consider: –Background color –Default font –Default link colors –Unvisited links –Visited links Create Head Content and Set Page Properties
© 2011 Delmar Cengage Learning Color picker showing color palettes Create Head Content and Set Page Properties Click list arrow to choose a color palette Web-safe palettes
© 2011 Delmar Cengage Learning A CSS layout block is a section of a web page that is defined and formatted using a Cascading Style Sheet. CSS has a set of formatting characteristics you can apply to text, tables, and other page objects. Create Head Content and Set Page Properties
© 2011 Delmar Cengage Learning Clean HTML code is code that does what it is supposed to do without using unnecessary instructions. The way fonts are rendered (drawn) on the screen differs between a Windows and Macintosh computer. Create, Import, and Format Text
© 2011 Delmar Cengage Learning Tags are the parts of the code that specify the appearance for all page content when viewed in a browser. Cascading Style Sheets are sets of formatting attributes that you use to format web pages to provide a consistent presentation across a site. Create, Import, and Format Text
© 2011 Delmar Cengage Learning To apply formatting to a website use: –The CSS Property inspector –HTML Property inspector Create, Import, and Format Text Regardless of which Property inspector you use, CSS styles will be created when you format page objects.
© 2011 Delmar Cengage Learning Create, Import, and Format Text Formatting the address on The Striped Umbrella home page Selected address text HTML button displays formatting options on Property inspector body_text ruleItalic button
© 2011 Delmar Cengage Learning A Font-family is a set of font choices that specify which fonts a browser should use to display the text on your web page. You can change the size of text by: –Using the CSS option and selecting a numerical value for the text –Using a size expressed in words Create, Import, and Format Text
© 2011 Delmar Cengage Learning To format a paragraph as a heading use the HTML Property inspector. The Format list contains six headings: –Heading 1-Heading 6, with Heading 1 being the largest and Heading 6 being the smallest Create, Import, and Format Text
© 2011 Delmar Cengage Learning Links make it possible for the viewers to: –Navigate all the pages in a website –Connect to other pages anywhere on the web Add Links to Web Pages Links added to menu bar
© 2011 Delmar Cengage Learning Broken links are links that cannot find their intended destinations. A point of contact is a place on a web page that provides users with a means of contacting the company. A mailto: link, is an email address that users can use to contact the company with questions or problems. Add Links to Web Pages
© 2011 Delmar Cengage Learning Add Links to Web Pages mailto: link on the Property inspector Email Link dialog box mailto: link Text for email on the page (this could also be a person’s name or position or the actual email link)
© 2011 Delmar Cengage Learning A menu bar, or a navigation bar, is an area on a web page that contains links to the main pages of a website. The WCAG Guideline 2.4 lists ways to ensure that all viewers can successfully and easily navigate a website. Add Links to Web Pages
© 2011 Delmar Cengage Learning The History panel records each editing and formatting task you perform and displays them in a list in the order in which you complete them. Each task listed in the History panel is called a step. Use the History Panel and Edit Code
© 2011 Delmar Cengage Learning You can drag the slider on the left side of the History panel to undo or redo steps Use the History Panel and Edit Code The History panel Drag slider up to undo steps Click in the bar next to a step to undo to that step
© 2011 Delmar Cengage Learning Use the History Panel and Edit Code Code displayed in the Code Inspector Page displayed in Design view behind the Code Inspector The Code Inspector is a separate window that displays the current page in Code view.
© 2011 Delmar Cengage Learning Testing web pages: –You should preview it in Live view or in a browser window –You should test your links to make sure they work properly –You should proofread your text –You should strike a balance among quality, creativity, and productivity Modify and Test Web Pages
© 2011 Delmar Cengage Learning You should test your pages using a variety of screen sizes. You should check your pages using both Windows and Macintosh platforms. Dreamweaver allows you to see what a page would look like if it were viewed on a mobile hand-held device. Modify and Test Web Pages
Chapter 1: Introduction. Contents Whats New in Dreamweaver CS4? The Dreamweaver CS4 Interface Setting Up a Site Creating a Web Page Adding Text to Your.
© 2011 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
© 2010 Delmar, Cengage Learning Chapter 3 Working with Text and Images.
© 2010 Delmar, Cengage Learning Chapter 9 Positioning Objects with AP Div Tags.
1 Web Site Design Overview of the Internet Cookie Setton.
Learning the Basics – Lesson 1
© 2010 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
Using a Template to Create a Resume and Sharing a Finished Document
© 2010 Delmar, Cengage Learning Chapter 4 Working with Links.
Chapter 3 Tables and Page Layout
Macromedia Dreamweaver MX 2004 Design Professional Web Page DEVELOPING A.
Create head content and set page properties Create, import, and format text Add links to Web pages Use the History panel and Code Inspector Modify and.
Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
Working with Text and Cascading Style Sheets Adobe Dreamweaver Chapter 3.
Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
© 2010 Delmar, Cengage Learning Chapter 7 Using Styles and Style Sheets for Design.
Chapter 3 Working with Text and Cascading Style Sheets.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.
© 2020 SlidePlayer.com Inc. All rights reserved.