Ohlone College Web Team Blog

The Web Content Accessibility Guidelines 1.0 (WCAG 1) recommendations by the Web Accessibility Initiative (WAI) are vague in some areas. An indepdendent group of developers, the WCAG Samurai, has created an errata (or “corrections” - which I think of as “clarifications”) for WCAG 1 using direct language such as “must” and “do not” and “not required”. Good stuff! Straightforward and no-nonsense.

Review the introduction to the WCAG Samurai errata.

This is the INVALID code to embed a Picasa slideshow on your web page (<embed> is invalid):

<embed type="application/x-shockwave-flash"
src="http://picasaweb.google.com/s/c/bin/slideshow.swf"
width="288" height="192"
flashvars="host=picasaweb.google.com&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2Fohlonecollegephotos%2Falbumid%2F5162154032057469201%3Fkind%3Dphoto%26alt%3Drss"
pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

And, here is the VALID XHTML equivalent for the same slideshow as referenced above (using the <object> tag):

<object type="application/x-shockwave-flash"
  data="http://picasaweb.google.com/s/c/bin/slideshow.swf"
  width="288" height="192">
  <param name="movie" value="http://picasaweb.google.com/s/c/bin/slideshow.swf" />
  <param name="flashvars" value="host=picasaweb.google.com&amp;RGB=0x000000&amp;feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2Fohlonecollegephotos%2Falbumid%2F5162154032057469201%3Fkind%3Dphoto%26alt%3Drss" />
  <param name="pluginspage" value="http://www.macromedia.com/go/getflashplayer" />
</object>

Updated June 17, 2009.

Using a valid <object> tag is apparently complex. Here are some solutions. Your mileage may vary.

Valid XHTML YouTube embed code generator - “This free tool will create a valid XHTML embed code for any YouTube video. The code YouTube shows on the embed field is not valid XHTML! However, you can simply use this simple tool to make it Valid XHTML 1.0 Transitional.”

Embedding YouTube Videos as Valid XHTML 1.0

Updated June 17, 2009.

Add &rel=0 after video ID number to turn off related videos in embedded players.

Example: http://www.youtube.com/v/ulakMBcqyPo&amp;rel=0

<object type="application/x-shockwave-flash"
style="width:425px; height:350px;"
data="http://www.youtube.com/v/ulakMBcqyPo">
<param name="movie" value="http://www.youtube.com/v/ulakMBcqyPo" />
<param name="wmode" value="transparent" />
</object>

XHTML Validation - Director/Shockwave

<object type="application/x-director"
data="Shockwaver.dcr" width="320" height="240">
<param name="src" value="loader.dcr" />
<param name="sw1" value="Shockwaver.dcr" />
<param name="swRemote" value="swSaveEnabled='false'
swVolume='true'
swRestart='false'
swPausePlay='false'
swFastForward='false'
swContextMenu='false' "/>
<param name="swStretchStyle" value="none" />
<img src="shockwaver_not.gif" width="320" height="240" alt="No shockwave?!" />
</object>

XHTML <object> Tag, Not <applet> Tag - Panoramas

<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" height="196" width="460" >
<param name="codebase" value="java" />;
<param name="code" value="panorama" />;
<param name="panorama" value="http://www.veiled-chameleon.com/images/hikes/grandeur-peak/grandeur-peak-full-circle.jpg" />;
<!--[if !IE]> -->;
<object codebase="java" classid="java:panorama.class" height="196" width="460" >;
<param name="panorama" value="http://www.veiled-chameleon.com/images/hikes/grandeur-peak/grandeur-peak-full-circle.jpg" />;
</object>
<!-- <![endif]-->
</object>

http://wikivid.com/

Tutorials for Dreamweaver:

http://wikivid.com/index.php/Dreamweaver

http://www.smashingmagazine.com/2006/11/09/online-generators/

Spry is Adobe’s version of AJAX.  It is included in Dreamweaver CS3.

• Spry Team blog
  • Spry 1.6 Dreamweaver CS3 Update
• Spry 1.6 improvements and standards
• Spry Best Practices - documentation, standards, demo and samples

To make file readable by others (i.e., the “world”), set the directory containing the files to:

• drwxr-xr-x
  or
  755

and set the files in the directory to:

• -rwxr--r--
  or
  644

Explanation of file permissions

There are 3 classes of permissions:

1. User (sometimes referred to as “owner”)
2. Group
3. Others (sometimes referred to as “all” or “world”)

A common notation for permissions is a series of 10 characters, such as:

• drwxr-xr-x
• -rw-r--r--
• -rw-rw-rw-

The first character represents the file type:

• - regular file
• d directory

The remaining 9 characters represent 3 permissions for each of the 3 classes:

• r read on
• w write on
• x execute on
• - off

Directories must have execute permissions, such as:

• drwx------
• drwxr-xr-x (most common)
• drwxrwxr-x
• drwxrwxrwx

Executable program files, such as CGI scripts, must have execute permissions, such as:

• -rwxr-xr-x

Regular files must have read and/or write permissions, such as:

• -rw-r--r-- (most common)
• -rw-rw-rw-

Read, write, and execute permissions may also be represented in octal notation:

• 4 read on
• 2 write on
• 1 execute on
• - off

The octal values are added to result in desired read-write-execute permissions:

• 4 + 2 + 1 = 7 for read-write-execute permissions rwx
• 4 + 2 = 6 for read-write permissions rw-
• 4 + 1 = 5 for read-execute permissions r-x
• 4 = 4 for read permissions r--

Examples of common octal notations are:

• 755 is same as drwxr-xr-x
• 644 is same as -rw-r--r--

See File System Permissions in Wikipedia for more information.

There is interest in/concern about the accessibility of podcasts / audio / video / multimedia materials instructors post from classroom lectures, etc. Below are some links with related information.

Blog entries on the topic of Podcast Accessibility by Jeffrey Daniel Frey, the Web Services Manager for Enterprise Applications in the Information Technology Department at Rice University. He provides technology solutions for faculty, staff, and students on campus as well as teaches new technology courses at the School of Continuing Studies. He is available for podcasting consulting, is involved in the creation of podcasts for businesses and non-profits, and has owned a technical consulting company and an audio/video recording studio).

Thread from a WebAIM discussion board.

Web Captioning, WebAIM article.

WebAIM, Creating Accessible Macromedia Flash Content.

(WebAIM = Web Accessibility In Mind, an *excellent* resource for online
accessibility requirements, tutorials, how-tos!)

How-to info for Making Podcasts Accessible by the High Tech Center at
College of the Redwoods.

How to Make Your Blog Accessible to Blind Readers.

Accessites.org - The Art of Accessibility.