Intro to Dreamweaver

Things to know before you start Dreamweaving —
• Onid web space: http://www.onid.orst.edu/docs/use/web.shtml

• FTP = File Transfer Protocol: Transferring files from your computer to a web server.

• Local vs. Remote

• File paths

• HTML is a programming language. HyperText Markup Language
http://archive.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimerP1.html

• CSS stands for Cascading Style Sheets. Used for design and layout.

• How do links work? Open new window?
• How do you display an image?

• Tables

• Index.html or .htm

• CSS Templates

• View Source

• Web graphics: gifs/jpegs

Dreamweaver MX 2004
• WYSIWYG editor

• Intro to the workspace
• Site View
• Properties

• Modify page properties
o Title
o Fonts
o Links
o Background

• Macromedia Exchange and Macromedia Extensions

• Dreamweaver and pre-made templates and create your own templates

CSSA Technology Workshops

Greetings CSSA’ers

The following technology workshops will be available for CSSA students during the spring term (2005)*:

(All workshops will be held on Thursdays in the Milne Computing Center, Room 130, from 4:00pm – 5:20pm.

WORKSHOP SCHEDULE/TOPICS:

April 7th: Adobe PhotoShop Basics

April 14th: Adobe PhotoShop — Print and Web Design

April 21st: Web Design I — Intro to Dreamweaver

April 28th: Web Design II — Advanced Dreamweaver

May 5th: Web Design III — Cascading Style Sheets, Accessibility, Usability, Web Statistics

May 12th: PowerPoint, Word, Outlook, and Adobe Acrobat — A grab bag of useful tips, tricks, and stuff they don’t put in books!

May 19th: Google — Advanced Search Techniques, Images, Translate Tool, Desktop Tool, Gmail, Maps, Local, Picasa, and whatever else Google invents by May 19th!

May 26th: Computer Hardware — Flash Drives, MP3 Players, Digital Cameras, How to burn a cd, etc.

If you have any questions/comments/requests, feel free to e-mail me at: eric.stoller at oregonstate.edu

* Technology workshops are for CSSA Graduate Students only. The Workshops cannot be taken for credit.

OSU EM Web Standards

OSU Enrollment Management Web Standards Responsibilities of Web Publishers

Content validity

As a web publisher at Oregon State University , you are responsible for the
content of your pages. You must ensure that your content is up to date and
is grammatically correct. Macromedia Dreamweaver has a built in spell checker
located in the “Text” menu (Shift + F7).

Content Maintenance

Pages must be accurate and up-to-date. Establish an updating system and identify
specific individuals to help maintain content validity.

Accessibility
OSU expects sites to be accessible to users with visual, hearing, mobility,
and cognitive disabilities. The guiding principle is that all OSU sites must
meet or exceed Section 508 (Priority 1) standards for accessibility.

http://oregonstate.edu/publications/webidentity/accessibility.html

Interface Consistency

Web Pages should “look and feel” like the OSU web page template.
http://oregonstate.edu/template/

Page Components

OSU Banner
Use the same OSU banner for all pages.

Search (or Virtual Advisor)

OSU Includes
OSU primary “includes” location: www/httpd-docs/u_central

For example:
<!--#include virtual="/u_central/banners/banner_or5a.php"--> =
orange banner

Cascading Style Sheet (CSS)
The default OSU style sheet will be used on every page.
Link to the central OSU style sheet
<link rel="stylesheet" href="http://oregonstate.edu/cws_templates/css/default.css" type="text/css"/>

Contextual Titles
Titles are used by search engines to identify pages when users search. Additionally,
if two or more pages have the same title, they cannot be differentiated
by users or the "Favorites" capability of a browser. Page titles
also aid users who are using screen readers.

Urchin (site statistics)
All new pages should contain the Urchin webstats script.
(See Eric for more information)

Site Directory Structure

Unlinked/Landing pages
Place all non-public\landing\temporary test pages in the root directory.
The only html files in the root should be current pages or pages which fall
into the aforementioned category.

Directory rules
No capital letters

Use lowercase for all file names.
Try to limit the use of #’s and _’s.

Use clear naming conventions: printapplications.html instead of papps.html

Technical Notes

Accessibility

Turn on “accessibility” in Dream weaver MX 2004.
A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc",
or in element content). http://tap.oregonstate.edu/webForm/a.htm

ALT tags is short for alternative tags.  ALT tags appear when you place
your mouse over an image.  They also appear when an image does not load
or is not allowed to load.  This provides a hint to a user reading from
a text only browser or one on a slow connection.  Screen readers also
use the ALT tags when reading to the visually impaired.  ALT tags are
very easy to add to your pages.

Frames
Do not use frames. Frames are not universally accessible.
The content of frames may not be searchable by search engines.

Descriptive links
Instead of denoting a link with the words "Click here" or similar
phrase, be descriptive when providing links; for example: "more information
about online applications." Consider allowing such links to stand on their
own line or provide an ordered or unordered list of links in HTML.

Meta Tags
Meta tagshelp search engines find and index your web pages.
Meta tags provide:

1. A brief description of the content

2. The edit date and name of the author or authoring department 3. Keyword
search terms for indexing.

Testing

Meta tags
For beta/test pages please include the following code in the <head> of
the document:
< META NAME="ROBOTS" CONTENT="NOINDEX,
NOFOLLOW">

A robot will not index this document, nor analyze it for links.

Validate code in Bobby, W3C, etc. http://bobby.watchfire.com/bobby/html/en/index.jsp
http://validator.w3.org/
http://www.cynthiasays.com/

Archival

Archive old pages on the EM Network Drive or on your department/personal hard
drive. Each department will have space allocated for archival of old pages.

Do not leave old web pages on the web server. Old pages are still “live” and
can be found via search engines and old links/bookmarks.

Resources

OSU training sessions
http://oregonstate.edu/tac/workshops/index.html

OSU Publications
http://oregonstate.edu/publications/webidentity/overview.html

Web sites

http://www.w3c.org
http://www.dontmakemethink.com/

Books
Krug, Steve. Don’t Make Me Think! A Common Sense Approach to Web Usability. Indianapolis : New Riders, 2000.

Veen, J. (2001). The art & science of web design. Indianapolis, IN : New Riders.