Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Introducing Dreamweaver Dreamweaver • The web development application used to create web pages • Part of the Adobe creative suite Workspace • Contains windows, tool bars and panel groups that are displayed when Dreamweaver is running Insert Panel • Allows you to add objects to a web page document Files Panel • Displays the files and folders associated with the active website Property Inspector • Used to change the properties of the selected text or object Defining a Web Site • A website needs to be defined before any web page documents are created • Includes specifying a folder name, a server technology, files location and remote server options • When a site is defined, a folder is created with the specified name and the folder is displayed in the files panel File Name Guidelines • CAN contain lowercase letters, numbers and underscores • Do NOT use spaces or uppercase letters • Do NOT start the filename with a number Creating a Web Page Document • Steps: – File (drop down menu) New (dialog box is displayed) – Select: • Blank Page • HTML • <none> – Click create Home Page • The main page or starting point of the website • INDEX: file name used in Dreamweaver to designate a web page document as the home page of a web site Page Title • The text displayed in the title bar of the browser window when a user views a web page • Also appears in the title bar of the Document Window in Dreamweaver • Spaces are OK • Fast way to change is to type the new title in the title box in the Document toolbar and press Enter Viewing a Web Page Document • Design View: – default display for web page documents. – Displays the document similar to how it will appear in a browser window • Code View: – Displays the code generated for the web page • Split View: – Combination of both Design and Code views Viewing a Web Page Document • Press F12 key to view a web page document in a browser window • A document can not be modified in the browser window Using a Table to Arrange Content • Content: the information presented to the user. EX: text or graphics • Tables: used for organizing and controlling the arrangement of content in a web page – Consists of horizontal rows and vertical columns – A cell is the intersection of a row and a column Table Width • Can be specified in either pixels or as a % of the width of the browser window • Pixel: a unit of measurement related to screen resolution • A table width specified in pixels is called Fixed Width because the width of the table will not change when a user resizes the browser window Tables, cont • Border: lines around the table and cells – 0 specifies no border displayed • Cell padding: number of pixels of blank space between the content in the cell and the cell’s boundary • Cell spacing: number of pixels between cells Creating Tables • Standard mode should be used when creating tables • To create a table select Insert (drop down menu) Table OR click the Table button in the Insert Panel 2 Ways to Select a Table • Place the insertion point in any cell and click the <table> tag in the tag selector • Point to a border or corner of the table and click • When a table is selected, the Property Inspector displays properties for that table Table Properties • W: table width • Align: position the table with in the web page document Cell Properties • Placing the insertion point in a cell displays the cell properties in the property inspector • W: width of cell in either a % of the table’s width or in a number of pixels – Can type the new value – Value is automatically in pixels unless you type the % sign • H: height of a cell in % or in pixels – Can type the new value Adding Rows and Columns • When a new row is added, it is added ABOVE the cell • A new column is added to the LEFT of the cell • To add TEXT, click in a cell to place the insertion point and then type the text • To insert a Line Break press Shift and Enter Tables, cont • Press the TAB key to move the insertion point to the next cell or press Shift and Tab to move to the previous cell • The arrow keys also move the insertion point between cells Character Buttons Menu • Includes other characters such as currency symbols, the copyright symbol, and registered trademark MISC • Edit (drop down Menu) Undo or Control and Z key to cancel the last action made • Commands (drop down Menu) Check Spelling to start checking the spelling from the insertion point • Ignore: useful for proper names that are not in the Dreamweaver dictionary Printing • From Browser: File (drop down Menu) Print – Make sure the correct printer is selected and click Print • File (drop down Menu) Print Preview – Determines how many pages will be printed for a web page • File (drop down Menu) Print Code or Control and P – To print code from Dreamweaver for a web page document Closing a Web Page Document • Means that its window is removed from the Dreamweaver workspace and the file is no longer in the computer’s memory Quitting Dreamweaver • Means that its window is removed from the desktop and the program is no longer in the computer’s memory Opening an Existing Web Site • To open a web site for editing that is NO LONGER listed in the Files Panel: • Site Manage Sites New ( Site Definition Dialog box is displayed) • Select the Advanced Tab to display options for defining an existing site • Type a site name in the Site Name Box and then click the Local Root Folder Icon Opening an Existing Web Site • Navigate to the location of the web site folder • Select OK at the bottom of the Site Definition Dialog Box to open the site Opening a Web Page Document • 2 ways: – Double click the file name in the Files Panel – File (drop down menu) Open • navigate to the file • Click the file name • Select OPEN • Several web page documents can be open at the same time Text Hyperlinks • Document-Relative Hyperlink: text that can be clicked to display a different web page document in the browser window for the SAME website • External Hyperlink or Absolute Hyperlink: a hyperlink that displays a web page from another website – Select _blank in the Target list in the Property Inspector to display the link in a new browser window