Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Download Using Macromedia Dreamweaver MX
Transcript
Dreamweaver MX BTA3Open Dreamweaver MX • Application used for creating web sites • Homepage must always be saved as index.htm • All files names must be in lowercase letters Defining a Web Site • Must define web site before you can add to it • This definition determines where all of the files for a site are located on the computer • Create a central web site folder on your computer (e.g. Personal Portfolio Website) • Save all web files into this folder • Create an images folder in your central web site folder • Save all images into this folder Dreamweaver MX • Three views: • Design • Design and Code • Code • You will use design view primarily but it is still important that you know about the code behind the design • HTML code is made up of tags (e.g. <body>) Dreamweaver Interface • Document Window • Main working area where you create and edit files • Property Inspector • Properties for objects or text selected in the document window • Insert Panel • Allows you to insert a huge number of HTML objects • Document Toolbar • Allows you to control your view Dreamweaver Interface • Tag Selector • Enables you to select any tag in the document and highlights the selected content in the document window • Panels and Panel Groups • Design • Behaviours (rollovers) • CSS Styles • Files • Allows you to define sites • Displays your site ‘assets’ Tables • Used to organize and control the arrangement of content in a web page • Tables <table> consist of rows <tr> and cells <td> • Width defined by pixels (fixed) or percentage of screen (flexible) • Cellspacing • Amount of space between cells • Cellpadding • Amount of space between side of cell and text Hyperlinks • The reason that HTML exists • HTML stands for Hypertext Markup Language • Hyperlinks <a> are added to text or images to allow people to move through your site or to other sites on the Internet Web Site Development • The process of planning and creating a web site • Planning includes: • Determining the web site’s purpose, audience, navigation structure, content, and page layout • Implementation includes: • Setting up the web site and creating the web pages • Revising pages Defining a Purpose • Stating the intent of the web site • Helps to make decisions about navigation and content • Describe the target audience • Composed of the people the site is being made for • Demographics (age, sex, income, education, etc.) • Psychographics (interests, beliefs, etc.) • Geographics • Behaviours Content and Structure • Required web pages are determined by the site’s purpose and audience • Home page contains general information and links to other pages • Organization of site is called navigation structure Navigation Structure Home Page Fun Page Games Biography Soccer page Graphic Design Reflection Samples Definitions • Home page is top-level page • FunPage|Biography|Graphic Design are second-level pages • The remainder of the pages are third-level pages • Games and Soccer Page are called same-level pages Determining Content • Content of each page is the text, images, and other objects such as Flash movies • Defined using the navigation structure of the site as an outline and then listing the text and objects for each page Determining Content Home Page • Your Logo • Purpose of the website • Brief introduction Bio • Age / Favourite food, •Music, etc… •Pictures of yourself / • family •Links Fun Page • links •Games •More pics, etc… Graphic Design • Reflection •Samples of work •Definitions of key terms Defining Navigation Bars • Top global navigation bar • Link to each page on the first and second levels • Can be text or images • Breadcrumb trail • Displays the page names in order of level, from the home page to the current page • Use > to separate pages • Local navigation bar • Can be positioned horizontally under top global navigation bar or vertically • Contains child pages of current page • Bottom global navigation bar • Should only use text links in a small size Web Page Layout Web Page Layout • Header • Top area of a web page • Includes a logo or heading, top global navigation bar • Breadcrumb trail • Footer • Bottom area of a web page • Includes bottom global navigation bar, copyright information, date of last update Concepts of Web Design • Remember to consider each of the principles of design when you are creating your pages • In addition, pay special attention to these concepts of web design: • • • • Appropriateness Placement Consistency Usability Appropriateness • How well the elements in a web site match the purpose and target audience • Ask yourself • Is the text appropriate for the audience? • Do the images fit the purpose of the web site? • Do the images fit the purpose of the web site? • Are they appropriate for the audience? • What other content would the audience expect to find at this web site? Placement • Placement of elements should follow generally accepted standards based on user expectations • Important information should be placed ‘above the fold’ • Newspaper terminology • Make sure that users don’t have to scroll to find important information • White space is important Consistency • Repetition • Place elements in the same location on each page • More important when number of pages increase Usability • How easy is it to navigate? • Should be easy for the user to find what they are looking for • Text should be limited to only necessary words and paragraphs • People don’t read on the web – they scan • Less words = easier to scan
