Integrating Images and Tables
Integrating elements, such as images and tables, are key in aiding to a more professional and organized presence to a web site. In doing so, making sure that these elements are accessible and compliant are important. The Faculty Web Templates provide a framework that allows to incorporate these elements easily. This section of the reference guide will demonstrate how to add images and tables into these templates.
When inserting images using Dreamweaver 8, Dreamweaver automatically generates a reference to the image file in the HTML source code. If the image file is not in the current site, Dreamweaver prompts the user whether the user wants to copy the file into the site.
Inserting an Image
Placeholders images have been placed in the templates as markers. All images align left with text wrapping around.
- Select the placeholder image and select the <Insert>, then <Image> from the Menu bar.
- Browse to the image that will be inserted.
- Click <OK>. The Image Tag Accessibility Attributes dialog box appears. If it does not show, please go to the section entitled Setting Up the Accessibility Features on the Setting Up Dreamweaver 8 page to activate this feature.
- Enter the values in the Alternative Text or Long Description text box, then click <OK>. For any questions concerning whether to use of alternative text or long description, please reference the ATI Frequently Asked Questions page. Note: information can be inserted in one or both text boxes depending upon the need. If <Cancel> is selected, the image appears in the document, but not the accessibility information (tags or attributes).
To learn more about inserting images in a web document using Dreamweaver 8, please refer to the Online Documentation for Dreamweaver 8, hosted by Adobe. In the side menu pane, navigate to <Adding Content to Pages>, <Inserting Images>, then <Inserting an image>.
Inserting a Table
To insert a table into a web page using Dreamweaver 8, do the following:
- In the Design view of the Document window, please the insertion point where the table will be placed.
- In the Menu bar, select <Insert>, then <Table>.
- Complete the dialog box. For the table size options, set them appropriately. For the header option, choose "Both". Under the Accessibility option, fill in each section appropriately. For more information concerning editing accessibility attributes for tables in Dreamweaver, please refer to the Online Documentation for Dreamweaver 8, hosted by Adobe. In the side menu pane, navigate to <Laying Out Pages>, <Presenting Content with Tables>, <Formatting tables and cells>, then <Editing accessibility attributes for a table>.
- Select <OK>. The table appears in the document.
To learn more about inserting tables in a web document using Dreamweaver 8, please refer to the Online Documentation for Dreamweaver 8, hosted by Adobe. In the side menu pane, navigate to <Laying Out Pages>, <Presenting Content with Tables>, then <Inserting a table and adding content>.
The next section to be covered is entitled Metatags and Title Attributes.