Contact and Return Home buttons
Purdue Marketing Communications.
space-for layout only About the Office. Starting Your Project. Communications Standards and Licensing. Downloads. The Web
About the Office
Contact Us Return to PMC Home page return home.
graphic
News Modules

Maintaining Web Sites

Request a Link to Purdue Top-Tier Pages

Access to FTP Web Site

Marketing for the Web

Web Writing Tips

Web Programming/Design Tips

ADA Compliance Tips

Technical Capabilities

Web Templates and Graphics

Web Graphics Guidelines

Web Gallery

PowerPoint Templates

Web Templates

Web Programming and Design Tips

Fireworks
10/4/02

PMC uses Fireworks to get graphics/images ready for the Web. Using Fireworks slice tool reduces the hours you would normally spend in other programs trying to slice your graphics for faster loading to a matter of minutes. Once the slices are set up, you can click on the icon in the center of the slice to set up drop-down menus. When you are ready, use the Export command to optimize your images/graphics for faster download. Fireworks will write the code for the HTML file as well as the Javascript file needed to run the drop-downs (you can easily rewrite these files or edit them to operate the way you would like them to). Combine this with Dreamweaver's templates and your site will be technically impressive and easy to manage. A few minor edits and reorganization of files is all it takes to load the site in to Zope, Apache, IIS, Appleshare IP, etc . . . Placing a HTML menu in each section makes the site navagational to browsers with java turned off, ADA readers, and Palm Pilots.

Style Sheets
9/16/02

Importing and using style sheets in your site allows you to change your type faces and sizes in seconds for the entire site. Here is an example of a type style:

.bodycopy { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; font-style: normal; line-height: 13px; font-weight: normal; font-variant: normal; text-transform: none; color: #000000}

This file was saved as "style_copy.css" and is called to the page in the <head> using the following commands:

<style>
<link rel="stylesheet" href="../../style_copy.css" type="text/css">
<style type="text/css">
</style>

To apply the style, apply the style to the <td> tag like this:

<td class="bodycopy">

Or, to apply the style to a paragraph:

<p class="bodycopy">

According to W3C, the <font> tag may phased out of the HTML language in future revisions to HTML and style sheets will be used to specify fonts.

Dreamweaver Library Items
9/10/02

Purdue Marketing Communications uses library items to manage menu lists within a site. The information on a Web site is organized into a series of sections, often with many subsections. Each page within each subsection uses the same submenu for navigation. Having a central source for this menu allows for the quick management of these links. Library items can also be used as a content management system within Dreamweaver if the content is saved as a library item. Library items can be found under "Window>Assets" once the window opens, click on the book icon to display the site's library items. To save an item as a library item:

1. Highlight the content you would like to save as a Library Item,
2. In the "Assets" toolbar, click on the arrow in the top-right corner and scroll down to "New Library Item",
3. Title your new library item with a name that's compatible with the naming convention of your site.

Dreamweaver Templates
9/9/02

PMC uses Dreamweaver templates to develop Web sites of all sizes. A single internal page is created and saved as a template (File>Save as Template), and all pages within the site are created using the template (File>New From Template). Templates allow for the easy management of the site's overall navigation and layout. Adding editable regions (Modify>Template>New Editable Region) to the site allows for non-technical staff to easily update a Web site without having to learn anything but the site's organization. By using templates and creating editable regions, you're defining the sections other people can update and restricting sections they cannot. Style sheets can also be applied to the <td> tag (example:<td class="bodycopy">) in the template to set the entire site to a consistent type face and size.

Copyright Information
3/23/01

We are often asked what copyright information should be included on a Web page. As a result, we have created a very small gif file that contains the disclaimer information and provided it for you on this page. We created it as a gif file rather than a server-side include because some campus servers do not have server-sides activated. The code not only gives you the image location, but it also links the image to the official disclaimer information. Here is the code:

For White Backgrounds

purdue homepage purdue search purdue maps purdue directories Copyright ©, Purdue University, all rights reserved. An equal access/equal opportunity university.
Purdue Disclaimer Purdue Nondiscrimination Policy

<table border="0" cellspacing="0" cellpadding="0" summary="purdue main links">
<tr align="left" valign="top">
<td><a href="http://www.purdue.edu" tabindex="500" title="purdue homepage"><img src="http://www.purdue.edu/oop/copyright/home.gif" border="0" alt="purdue homepage"></a></td>
<td><a href="http://index.cc.purdue.edu:8765/" tabindex="501" title="search purdue"><img src="http://www.purdue.edu/OOP/copyright/search.gif" border="0" alt="purdue search"></a></td>
<td><a href="http://news.uns.purdue.edu/newsweb.maps.html" tabindex="502" title="purdue maps"><img src="http://www.purdue.edu/OOP/copyright/map.gif" border="0" alt="purdue maps"></a></td>
<td><a href="http://directory.purdue.edu/ph-query.html" tabindex="503" title="purdue directories"><img src="http://www.purdue.edu/OOP/copyright/directories.gif" border="0" alt="purdue directories"></a></td>
<td><img src="http://www.purdue.edu/OOP/copyright/copyright_r.gif" usemap="#copyMap" border="0" width="307" height="30" alt="Copyright &copy;, Purdue University, all rights reserved. An equal access/equal opportunity university." title="nondiscrimination policy"></td>
</tr>
</table>

For Black Backgrounds

Purdue Homepage Purdue Search Purdue Maps Purdue Directories Copyright©, Purdue University, all rights reserved.Purdue University, West Lafayette, IN 47907 USA, 765-494-4600An equal access/equal opportunity university

<table border="0" cellspacing="0" cellpadding="0">
<tr align="left" valign="top">
<td><a href="http://www.purdue.edu"><img src="http://www.purdue.edu/OOP/copyright/home_b.gif" border="0" alt="Purdue Homepage"></a></td>
<td><a href="http://index.cc.purdue.edu:8765/"><img src="http://www.purdue.edu/OOP/copyright/search_b.gif" border="0" alt="Purdue Search"></a></td>
<td><a href="http://news.uns.purdue.edu/newsweb.maps.html"><img src="http://www.purdue.edu/OOP/copyright/map_b.gif" border="0" alt="Purdue Maps"></a></td>
<td><a href="http://directory.purdue.edu/ph-query.html"><img src="http://www.purdue.edu/OOP/copyright/directories_b.gif" border="0" alt="Purdue Directories"></a></td>
<td><img src="http://www.purdue.edu/OOP/copyright/copyright_r_b.gif" usemap="#copyMap3" border="0" width="307" height="30" alt="Copyright&copy; 2002, Purdue University, all rights reserved.Purdue University, West Lafayette, IN 47907 USA, 765-494-4600An equal access/equal opportunity university"></td>
</tr>
</table>

For Accent Gold Backgrounds (E0D5C5)

purdue homepage purdue search purdue maps purdue directories Copyright ©, Purdue University, all rights reserved. An equal access/equal opportunity university.

<table border="0" cellspacing="0" cellpadding="0" summary="purdue main links">
<tr align="left" valign="top">
<td><a href="http://www.purdue.edu" tabindex="500" title="purdue homepage"><img src="http://www.purdue.edu/OOP/copyright/e0d5c5_buttons/home.gif" border="0" alt="purdue homepage"></a></td>
<td><a href="http://index.cc.purdue.edu:8765/" tabindex="501" title="search purdue"><img src="http://www.purdue.edu/OOP/copyright/e0d5c5_buttons/search.gif" border="0" alt="purdue search"></a></td>
<td><a href="http://news.uns.purdue.edu/newsweb.maps.html" tabindex="502" title="purdue maps"><img src="http://www.purdue.edu/OOP/copyright/e0d5c5_buttons/map.gif" border="0" alt="purdue maps"></a></td>
<td><a href="http://directory.purdue.edu/ph-query.html" tabindex="503" title="purdue directories"><img src="http://www.purdue.edu/OOP/copyright/e0d5c5_buttons/directories.gif" border="0" alt="purdue directories"></a></td>
<td><img src="http://www.purdue.edu/OOP/copyright/e0d5c5_buttons/copyright.gif" usemap="#copyMap2" border="0" width="307" height="32" alt="Copyright &copy; 2002, Purdue University, all rights reserved. An equal access/equal opportunity university." Title="nondiscrimination policy"></td>
</tr>
</table>

We will keep this code up to date with the latest information.

For more information on who can use this copyright information, please contact: pmc@pmc.purdue.edu

Macromedia Exchange
3/7/01

Through the Macromedia Exchange program, you can easily download extensions, code, and other features that will add functionality to programs such as Dreamweaver and Flash. Go to the Macromedia Exchange Web site and get a user ID to begin using this service. Before you download anything from the site, be sure to check user's feedback for testing and troubleshooting information.

PDF forms that are ADA compliant
2/28/01

Traditionally, PDF files have not been ADA compliant and are difficult to translate to text files. In answer to this, Adobe created a Perl engine to translate PDF files to text files. The code below uses an invisible variable that is preset to translate the PDF file you specify.

<FORM METHOD="POST" ACTION="http://access.adobe.com/perl/convertPDF.pl" ENCTYPE="x-www-form-urlencoded">
<TABLE BORDER="0" CELLPADDING="5" CELLSPACING="0">
<TR>
<TD WIDTH="79%" VALIGN="top" ALIGN="left" ROWSPAN="2">
<P>
<A NAME="anchor7240"></A>
</A>
<TABLE BORDER="0" CELLSPACING="2" CELLPADDING="0">
<TR>
<TD WIDTH="50"</TD><TD WIDTH="350" VALIGN="TOP">
<INPUT TYPE="hidden" NAME="url" VALUE="http://www.InputYourPDFAddressHere">
</TD>
</TR>
<TR>
<TD WIDTH="50">
</TD>
<TD WIDTH="350" VALIGN="TOP">
<INPUT NAME="submit" TYPE="submit" VALUE="Convert PDF to Text" ALT="Click to Get this Adobe PDF Document as HTML text" TABINDEX=3>
</TD>
</TR>
</TABLE>
<P>
</P>
</TD>
</TR>
</TABLE>
</FORM>

An example of this can be found on http://www.purdue.edu/OOP/parents/.

 

Links without underlining
2/28/01

To clean up a page with many links or to create a more streamlined appearance, underlines below links can be removed by placing the code below in the head of your page.

<style type="text/css">
<!--
A:link {text-decoration: none} A:visited {text-decoration: none} A:active {text-decoration: none}
//-->
</style>

space-for layout only    

purdue homepage purdue search purdue maps purdue directories Copyright ©, Purdue University, all rights reserved. An equal access/equal opportunity university.
Purdue Disclaimer Purdue Nondiscrimination Policy