Dreamweaver Tutorial

[advanced session]

Tables:

• Used for alignment of the page of itself or present content on part of the page
• Supported by 3.0+ browsers
• Can have nested tables
• Background: Images and Colors
• Borders
• V Space: makes space above and below the table
• H Space: makes space to the left and right of the table
• CellPadding vs. CellSpacing
• CellSpacing= amount of space around the cell itself
• CellPadding= amount of space around a table cell item
• Horizontal and Vertical Alignment of cell content
• Sort Table Content: Command > Sort Table
• Format Table:  Command > Format Table
• Row Span & Column Span

Frames:

• Frames window
• Modify—Frameset---Split Frames
• Scroll: Default, Yes, No Auto
• Resize
• Border/Border Color
• Target to Frame Names or to self, parent, top, blank
• _self: loads file into current frame
• _parent: loads file into the enclosing frame or current frame
• _top: loads file into current window
• _blank: opens a new window and loads the file into that window
• Save Frameset vs. Save All

Metatags & Search Engines

• Each search engine uses a different method of indexing web pages
• Aren’t visible when you view your page
• Keywords: words that give a good account of the content of the page, separated by commas
• Description: Describes the purpose and the content of the page

Bobby & Alternative Tags

• It’s important to make your page accessible to people using web text readers or have slow modems.  A good tool for checking the accessibility of your page is Bobby: http://www.cast.org/bobby

When you use the Bobby program, you need to look for whether or not it returns any Priority One errors after checking a page.  After fixing those, you also need to make sure that the Priority One “User Checks” don’t apply to the page.  “User Checks” are those items that the program can not determine if are present in the page or not; they must be checked by the user manually.  A page is Bobby Approved when there are no priority one errors and the “user checks” priority one errors listed do not apply to the page.

·       Provide Alternative Text for all Images, Image Maps, and Image Hot Spots:

You can do this by using either the properties window in Dreamweaver or by going into the HTML code and typing alt="" or whatever the text needs to be.  Most of the graphics have no real use to someone reading the page with a web reader, so when in doubt use alt="" .  For example, use the empty description for the ball.gif and alt="Navigational Bar" for the Left Navigational Bar graphic.

According to the Bobby web site:

"When creating alternative text, aim for a functional label based on the context in which it is used rather than a visual description. A good test to determine if alternative text is useful is to imagine reading the document aloud over the telephone. What would you say upon encountering this image to make the page comprehensible to the listener?"

More info in Alternative Text: http://www.cast.org/Bobby/html/gls/g9.html

Further Resources:

• Some Tutorials:
• http://www.iboost.com/build/software/dw/tutorial/786.htm
• http://hotwired.lycos.com/webmonkey/98/27/index1a.html
• http://wally.rit.edu/instruction/web/drw3/

·       Official Dreamweaver Tutorial and Information (Dreamweaver 4):

o      http://www.macromedia.com/support/dreamweaver/tutorial.html

• http://www.w3schools.com