UIUC Library Web UIUC Library Web OrientationOrientation

The do’s and don’ts of Web The do’s and don’ts of Web editing in the Libraryediting in the Library

So What’s The Point?So What’s The Point?

The purpose of this orientation is to The purpose of this orientation is to familiarize students and staff with the familiarize students and staff with the protocol for creating and developing protocol for creating and developing Library Web pages.Library Web pages.

Provided throughout the presentation Provided throughout the presentation are links to relevant resources that are links to relevant resources that will help guide you through the Web will help guide you through the Web development process.development process.

What this orientation will What this orientation will cover.cover. What is the Systems Office and what do What is the Systems Office and what do

they do?they do? Accessing your Library’s Web pages.Accessing your Library’s Web pages. The Library Gateway.The Library Gateway. The Proxy Server and Electronic The Proxy Server and Electronic

Resources.Resources. Library requirements for Web pages.Library requirements for Web pages. University requirements for Web pages.University requirements for Web pages. ADA Compliance.ADA Compliance. Design TipsDesign Tips Web Editors (WSYWIGs)Web Editors (WSYWIGs) Training and other resources.Training and other resources.

What this orientation is What this orientation is NOT.NOT. This orientation is NOT a class on This orientation is NOT a class on

Web design. Rather its purpose is to Web design. Rather its purpose is to familiarize Library personnel with the familiarize Library personnel with the systems and issues they will systems and issues they will encounter while creating and encounter while creating and updating Library Web pages. The updating Library Web pages. The specifics of Web programming and specifics of Web programming and the use of certain Web applications the use of certain Web applications will not be addressed. However, will not be addressed. However, resources pertaining to training, resources pertaining to training, policy, and protocol will be policy, and protocol will be discussed.discussed.

The Library Systems The Library Systems OfficeOffice

What we do and how we can helpWhat we do and how we can help

The role of the Systems The role of the Systems Office.Office. The Systems office is The Systems office is

responsible for coordinating and responsible for coordinating and developing Library systems developing Library systems including Web resources.including Web resources.

The Systems Office is the The Systems Office is the Library Webmaster and receives Library Webmaster and receives problem reports pertaining to all problem reports pertaining to all Library Web resources and Library Web resources and Library Web pages.Library Web pages.

When you should contact the When you should contact the Library Systems Office Library Systems Office regarding Web issuesregarding Web issuesSome examples :Some examples : OOPS! You just erased your site and do not have a OOPS! You just erased your site and do not have a

backup. (Retrieving files is a lengthy process which backup. (Retrieving files is a lengthy process which is why YOU SHOULD ALWAYS MAKE BACKUPS!)is why YOU SHOULD ALWAYS MAKE BACKUPS!)

You just entered a new resource into ErEdit and You just entered a new resource into ErEdit and you need to have it entered in the proxy server. you need to have it entered in the proxy server. Also, you have checked the proxy url and it returned Also, you have checked the proxy url and it returned a specific error.a specific error.

Your site is down and you do not know why and you Your site is down and you do not know why and you have exhausted the possibilities.have exhausted the possibilities.

You need to grant permissions to users so that they You need to grant permissions to users so that they can access the Web servers.can access the Web servers.

You have special scripting or database needs.You have special scripting or database needs.

What the Library Systems What the Library Systems Office does not do.Office does not do. Our primary function is the Our primary function is the

development and implementation development and implementation and upkeep of Library wide systems. and upkeep of Library wide systems. We do not consult or program for We do not consult or program for individual libraries except in special individual libraries except in special instances.instances.

We do not provide training for Web We do not provide training for Web editors (see the section on training).editors (see the section on training).

Contact InformationContact Information

If you have questions about the Library web site, If you have questions about the Library web site, send an email to webmaster@library.uiuc.edu. You send an email to webmaster@library.uiuc.edu. You may also call the Library Systems Office at 244-may also call the Library Systems Office at 244-4688. 4688. 

Note:Note: Library web pages that do not begin with the Library web pages that do not begin with the URL: http://www.library.uiuc.edu/ ; URL: http://www.library.uiuc.edu/ ; http://web.library.uiuc.edu ; or http://web.library.uiuc.edu ; or http://door.library.uiuc.edu are not on the library http://door.library.uiuc.edu are not on the library webserver and are not controlled by the Library webserver and are not controlled by the Library Systems Office. For example, the Africana Library Systems Office. For example, the Africana Library web pages are on the server: web pages are on the server: http://wsi.cso.uiuc.edu/ We will try to answer http://wsi.cso.uiuc.edu/ We will try to answer questions about these pages, but policies differ questions about these pages, but policies differ from webserver to webserver. We will be happy to from webserver to webserver. We will be happy to forward your questions and comments about non-forward your questions and comments about non-library pages to the appropriate library staff library pages to the appropriate library staff member.member.

LIBWEB Listserv for helpLIBWEB Listserv for help

The library has an electronic discussion list The library has an electronic discussion list (listserv) called libweb-l for library web (listserv) called libweb-l for library web contacts. The purpose of this list is to contacts. The purpose of this list is to facilitate communications between the facilitate communications between the webmaster and web contacts. It can also webmaster and web contacts. It can also be a great forum for asking questions of be a great forum for asking questions of your peers and sharing interesting things your peers and sharing interesting things you have found. you have found. 

People who work on UIUC Library web People who work on UIUC Library web pages are encouraged to join this listserv. pages are encouraged to join this listserv. For more information about LIBWEB-L, For more information about LIBWEB-L, please send email to LIBWEB-L-please send email to LIBWEB-L-REQUEST@postoffice.cso.uiuc.eduREQUEST@postoffice.cso.uiuc.edu

Accessing your Library’s Accessing your Library’s Web pagesWeb pages

Finding your Library's Finding your Library's directory on the directory on the WebserverWebserver Login to UIUC Library

When you log in to your computer (enter your username and password), make sure the domain in the bottom box reads "UIUCLIBRARY". If it does not, use the drop down menu provided to select the UIUCLIBRARY domain name and press <Enter> to log in.

On the Start Menu, locate the "Windows NT Explorer". It will

probably be under Programs/Windows NT Explorer.

Double click on "Network Neighborhood" or "My Network Places" on Windows 2000, to begin searching for networked computers. You may have to first choose Entire Network, then UIUCLIBRARY, then Find Libgrenlil>[your library directory]. Some units have already been moved to cooper.library.uiuc.edu. If your unit has pages with url http://door.library.uiuc.edu, then you will be editing on cooper.

Your library's Web pages will be in this folder. Example:

webpages for Library and Information Sciences are in a folder called lsxweb and for Chemistry it is chxWeb.

Moving FilesMoving Files

The only means by which you can move The only means by which you can move files from your local directory to the files from your local directory to the Webserver is to place them directly using Webserver is to place them directly using Windows Explorer or negotiating the Windows Explorer or negotiating the Library’s directory structure.Library’s directory structure.

The Library does not support FTP access The Library does not support FTP access to the Webserver. This means that all Web to the Webserver. This means that all Web editing must be done from a machine on editing must be done from a machine on the Library’s domain with access to the the Library’s domain with access to the appropriate directories.appropriate directories.

Quick access to Web space Quick access to Web space by mapping a drive. by mapping a drive. To map a network drive:To map a network drive: Open Windows NT ExplorerOpen Windows NT Explorer At the top of the page click on Tools>Map Network DriveAt the top of the page click on Tools>Map Network Drive Select the default drive letter that is given.Select the default drive letter that is given. Click on the "Browse" button to locate the folder for which Click on the "Browse" button to locate the folder for which

you want to create a shortcut. Using the same path as you want to create a shortcut. Using the same path as above (libgrenlil>[your library directory])above (libgrenlil>[your library directory])

Click on "Ok"Click on "Ok" Be sure to click on "Reconnect at logon".Be sure to click on "Reconnect at logon". You will be asked if you want to restart the computer. Until You will be asked if you want to restart the computer. Until

you restart, the network drive will not show up in Windows you restart, the network drive will not show up in Windows Explorer.Explorer.

To access your "new" drive:To access your "new" drive: Open Windows Explorer.Open Windows Explorer. Your drive will appear in the left pane and all drives are Your drive will appear in the left pane and all drives are

listed in alphabetical order.listed in alphabetical order.

The Gateway The Gateway Navigation BarNavigation Bar

The Library’s Online IdentityThe Library’s Online Identity

What is the Library What is the Library Gateway Navigation Bar?Gateway Navigation Bar? The Gateway Navigation Bar is a The Gateway Navigation Bar is a

navigational tool that provides easy access navigational tool that provides easy access to critical Library resources while serving to critical Library resources while serving as the Library’s “icon”.as the Library’s “icon”.

The Gateway helps users identify official The Gateway helps users identify official Library Web pages and to negotiate the Library Web pages and to negotiate the extensive Library Web.extensive Library Web.

*While the Gateway Navigational Bar is *While the Gateway Navigational Bar is

REQUIREDREQUIRED on all Library home pages, we on all Library home pages, we strongly urge you to include it on all other strongly urge you to include it on all other pages in your library Web.pages in your library Web.

How does it get on Library How does it get on Library pages? From where does it pages? From where does it come?come? The Library Gateway navigation bar is referred to as The Library Gateway navigation bar is referred to as

an “include”. Essentially this means that the an “include”. Essentially this means that the Gateway navigation bar “lives” outside the code on Gateway navigation bar “lives” outside the code on your page. By inserting a few simple lines in your your page. By inserting a few simple lines in your code, the browser will “pull” the Gateway navigation code, the browser will “pull” the Gateway navigation include and insert it automatically in your page. This include and insert it automatically in your page. This means that you will NOT see the Gateway means that you will NOT see the Gateway navigation bar if you are using a WSIWYG Web navigation bar if you are using a WSIWYG Web editor. editor. (If you do see the Gateway navigation bar (If you do see the Gateway navigation bar in your editor, you are probably in violation of in your editor, you are probably in violation of Library protocol regarding the Gateway, more Library protocol regarding the Gateway, more on this later). on this later). You can find instruction on inserting You can find instruction on inserting the appropriate code at:the appropriate code at:

https://wwws1.library.uiuc.edu/webguide/navbarinst.htmhttps://wwws1.library.uiuc.edu/webguide/navbarinst.htm

What you may do with the What you may do with the Gateway.Gateway.

You may choose the “design” that You may choose the “design” that best fits your Library’s page.best fits your Library’s page.

The Library Gateway Navigation Bar The Library Gateway Navigation Bar comes in two “flavors”, horizontal comes in two “flavors”, horizontal and vertical. and vertical.

Code for including each of these can Code for including each of these can be found at: be found at:

https://wwws1.library.uiuc.edu/webguide/navbarinst.htm https://wwws1.library.uiuc.edu/webguide/navbarinst.htm

What you may NOT do with the Library What you may NOT do with the Library Gateway.Gateway.

You may not manipulate the Gateway Navigation Bar in You may not manipulate the Gateway Navigation Bar in any way!any way!

The Gateway Navigation Bar MUST be added to your home page The Gateway Navigation Bar MUST be added to your home page using the “include code”. You should not pull the Gateway using the “include code”. You should not pull the Gateway Navigation Bar code (for example from a browser window) and Navigation Bar code (for example from a browser window) and manipulate it and/or add insert it into your pages. (Remember manipulate it and/or add insert it into your pages. (Remember that the purpose of the Gateway Navigation Bar is to provide that the purpose of the Gateway Navigation Bar is to provide consistency and to make Library pages easily identifiable.)consistency and to make Library pages easily identifiable.)

You should not add to or change the Gateway Navigation Bar You should not add to or change the Gateway Navigation Bar code in any way. Doing so may cause the Gateway to distort code in any way. Doing so may cause the Gateway to distort when viewed in certain browsers. when viewed in certain browsers.

NoteNote: The Systems Office does check for compliance and since : The Systems Office does check for compliance and since most Web problems are reported directly to us, we may most Web problems are reported directly to us, we may make the necessary corrections to your pages.make the necessary corrections to your pages.

Library Web page Library Web page requirementsrequirements

What no page can do with out.What no page can do with out.

The FooterThe FooterAll Library Web pages should contain:All Library Web pages should contain:

a textual link to the UIUC Library Home Page a textual link to the UIUC Library Home Page http://www.library.uiuc.eduhttp://www.library.uiuc.edu

a textual link to the UIUC Home Page a textual link to the UIUC Home Page http://www.uiuc.eduhttp://www.uiuc.edu  

a local email contact in YOUR library. Do a local email contact in YOUR library. Do not not use "Library use "Library Webmaster" or any Library Systems Staff's contact information. Webmaster" or any Library Systems Staff's contact information. All libraries should now have a form with which users can contact All libraries should now have a form with which users can contact the library. Please contact the Webmaster if you have any the library. Please contact the Webmaster if you have any questions about the form or how to link it from your site.questions about the form or how to link it from your site.

   a "Last updated" date with the initials of the person who last a "Last updated" date with the initials of the person who last

updated the page. updated the page. For .html and .htm files you can use this line of code For .html and .htm files you can use this line of code <!--#echo var="LAST_MODIFIED" --> <!--#echo var="LAST_MODIFIED" --> to insert the last modified date from the web server.to insert the last modified date from the web server.

Remember, if in doubt, simply peek at other Library’s pages. All Remember, if in doubt, simply peek at other Library’s pages. All Library pages should be compliant with these guidelines.Library pages should be compliant with these guidelines.

University Web page University Web page requirementsrequirements

What no page can do with out.What no page can do with out.

Official University Web Official University Web pagespageshttp://www.uiuc.edu/help/recommend.hthttp://www.uiuc.edu/help/recommend.htmlml Campus LogoCampus Logo Contact InformationContact Information Navigational LinksNavigational Links Avoid Duplication of ContentAvoid Duplication of Content Text Only SitesText Only Sites Date StampDate Stamp Keep Main Navigation Pages SmallKeep Main Navigation Pages Small Follow Campus Policy and ProceduresFollow Campus Policy and Procedures

http://www.admin.uiuc.edu/cam/cam/iii/iii-1.htmlhttp://www.admin.uiuc.edu/cam/cam/iii/iii-1.html Don't AdvertiseDon't Advertise Obey Copyright LawsObey Copyright Laws Use Meta TagsUse Meta Tags Web SearchesWeb Searches

http://ljordal.cso.uiuc.edu/compass/talk/http://ljordal.cso.uiuc.edu/compass/talk/ Maintain a Quality SiteMaintain a Quality Site

Users With Disabilities Users With Disabilities Web page requirementsWeb page requirements

Making pages accessible to everyone.Making pages accessible to everyone.

ADA ComplicityADA Complicityhttp://lrs.ed.uiuc.edu/access/http://lrs.ed.uiuc.edu/access/

As a public institution, UIUC is required to comply As a public institution, UIUC is required to comply with ADA regulations. These requisites govern how with ADA regulations. These requisites govern how we approach our Web development and provide we approach our Web development and provide guidelines for making Web pages accessible to guidelines for making Web pages accessible to everyone.everyone.

Quick Tips for Making Quick Tips for Making Accessible Web SitesAccessible Web Sites

For Complete Guidelines & Checklist: For Complete Guidelines & Checklist: www.w3.org/WAIwww.w3.org/WAI Images & animations.Images & animations. Use the Use the altalt attribute to describe the attribute to describe the

function of each visual. function of each visual. Image maps.Image maps. Use the client-side Use the client-side mapmap and text for hotspots. and text for hotspots. Multimedia.Multimedia. Provide captioning and transcripts of audio, and Provide captioning and transcripts of audio, and

descriptions of video. descriptions of video. Hypertext links.Hypertext links. Use text that makes sense when read out of Use text that makes sense when read out of

context. For example, avoid "click here." context. For example, avoid "click here." Page organization.Page organization. Use headings, lists, and consistent Use headings, lists, and consistent

structure. Use structure. Use CSSCSS for layout and style where possible. for layout and style where possible. Graphs & charts.Graphs & charts. Summarize or use the Summarize or use the longdesclongdesc attribute. attribute. Scripts, applets, & plug-ins.Scripts, applets, & plug-ins. Provide alternative content in case Provide alternative content in case

active features are inaccessible or unsupported. active features are inaccessible or unsupported. Frames.Frames. Use the Use the noframes noframes element and meaningful titles. element and meaningful titles. Tables.Tables. Make line-by-line reading sensible. Summarize. Make line-by-line reading sensible. Summarize. Check your work.Check your work. Validate. Use tools, checklist, and guidelines Validate. Use tools, checklist, and guidelines

at at http://www.w3.org/TR/WCAG http://www.w3.org/TR/WCAG

(c) W3C (MIT, INRIA, Keio) 2001/01(c) W3C (MIT, INRIA, Keio) 2001/01

Where to test your pages for Where to test your pages for accessibility.accessibility.

The following links are accessibility “checkers” and The following links are accessibility “checkers” and resources.resources.

W3 – W3 –

http://www.w3.org/TR/WCAGhttp://www.w3.org/TR/WCAG

BBobby -obby -http://bobby.watchfire.com/bobby/html/en/index.jsp http://bobby.watchfire.com/bobby/html/en/index.jsp

Accessibility extensions can also be added to Accessibility extensions can also be added to DreamWeaver and other WYSIWYG editors that will DreamWeaver and other WYSIWYG editors that will test your code for accessibility according to W3 test your code for accessibility according to W3 guidelines.guidelines.

Accessing Electronic Accessing Electronic ResourcesResources

The Proxy Server and EreditThe Proxy Server and Eredit

The Proxy ServerThe Proxy Server What is the Proxy Server?What is the Proxy Server?

The Proxy Server is a intermediate machine that The Proxy Server is a intermediate machine that connects off-campus users to databases that connects off-campus users to databases that are restricted to on-campus users. An off-are restricted to on-campus users. An off-campus users Web browser contacts the campus users Web browser contacts the Proxy Server which, in-turn, communicates Proxy Server which, in-turn, communicates with the database’s Web site. This makes the with the database’s Web site. This makes the off-campus user “appear” to be on-campus.off-campus user “appear” to be on-campus.

More Information can be found at:More Information can be found at:http://www.library.uiuc.edu/proxyhttp://www.library.uiuc.edu/proxy

How do Library’s route their patrons How do Library’s route their patrons through the Proxy Server?through the Proxy Server?

Patrons are routed through the proxy server when Patrons are routed through the proxy server when certain Online Resource URL’s are altered to certain Online Resource URL’s are altered to contain the address of the proxy server. contain the address of the proxy server. – See – See next slidenext slide

The Proxy PrefixThe Proxy Prefix

In order for URL’s to route users through the In order for URL’s to route users through the Proxy Server, the URL must contain a Proxy Server, the URL must contain a Proxy Prefix. The UIUC Library Proxy Proxy Prefix. The UIUC Library Proxy Prefix is:Prefix is:

http://www.library.uiuc.edu/proxy/go.asp?url=http://www.library.uiuc.edu/proxy/go.asp?url=

A typical proxied URL would look like this:A typical proxied URL would look like this:

http://www.library.uiuc.edu/proxy/go.asp?http://www.library.uiuc.edu/proxy/go.asp?url=http://www.nameofresource.com/url=http://www.nameofresource.com/science/journal/12345science/journal/12345

A resource must be listed A resource must be listed in the Proxy Server!in the Proxy Server! A resource must be listed in the Proxy Server in order to be A resource must be listed in the Proxy Server in order to be

proxied using the Proxy Prefix.proxied using the Proxy Prefix. If you check your proxy URL in the System’s Office provided If you check your proxy URL in the System’s Office provided

checker (checker (http://www.library.uiuc.edu/proxy/test/test.asphttp://www.library.uiuc.edu/proxy/test/test.asp) and ) and receive an error, you should report this error to the Systems receive an error, you should report this error to the Systems Office as the Proxy Server needs to be updated with the new Office as the Proxy Server needs to be updated with the new resource information.resource information.

To check that a resource is appropriately entered in our To check that a resource is appropriately entered in our database and servers you should:database and servers you should:

Search for the resource using ErSearch Search for the resource using ErSearch http://www.library.uiuc.edu/ersearchhttp://www.library.uiuc.edu/ersearch

If the resource can be located and NEEDS to be proxied you can If the resource can be located and NEEDS to be proxied you can copy the URL from the search pages onto your Library’s page. copy the URL from the search pages onto your Library’s page.

Search for the resource using ErEditSearch for the resource using ErEdithttp://www.library.uiuc.edu/eredithttp://www.library.uiuc.edu/ereditIf the resource can not be found in ErEdit, it must be added. If the resource can not be found in ErEdit, it must be added.

For help adding resources in ErEdit see:For help adding resources in ErEdit see:http://www.library.uiuc.edu/eredit/help.htmlhttp://www.library.uiuc.edu/eredit/help.html

Important reminders Important reminders regarding the addition of new regarding the addition of new resources in ErEdit.resources in ErEdit. In order for new resources to be In order for new resources to be

proxied, there are two requisites proxied, there are two requisites that must be satisfied in ErEdit.that must be satisfied in ErEdit.

1.1. The resource must have a The resource must have a complete URL (including the proxy complete URL (including the proxy prefix) in the URL field.prefix) in the URL field.

2.2. The “Access Type” must be set to The “Access Type” must be set to “UIUC - UIUC people (off-campus “UIUC - UIUC people (off-campus access using NetID or barcode)”.access using NetID or barcode)”.

How can you tell if the Proxy How can you tell if the Proxy URL will work? Is the resource URL will work? Is the resource configured at the Proxy configured at the Proxy Server?Server? The problem with checking a proxy URL from your The problem with checking a proxy URL from your

respective Library is that you will be doing so from respective Library is that you will be doing so from an “on-campus” machine and therefore have an “on-campus” machine and therefore have access to most resources by default. Therefore, to access to most resources by default. Therefore, to check your proxy URL you must be considered “off-check your proxy URL you must be considered “off-campus”.campus”.

To circumvent this problem the Systems Office has To circumvent this problem the Systems Office has provided a proxy URL checker at provided a proxy URL checker at http://www.library.uiuc.edu/proxy/test/test.asphttp://www.library.uiuc.edu/proxy/test/test.asp

If you check your proxy URL in the System’s Office If you check your proxy URL in the System’s Office provided checker and receive an error, you should provided checker and receive an error, you should report this error to the Systems Office as the Proxy report this error to the Systems Office as the Proxy Server needs to be updated with the new resource Server needs to be updated with the new resource information.information.

Adding and Editing Adding and Editing Electronic Resources Electronic Resources

Protocol and Courtesy with ErEditProtocol and Courtesy with ErEdit

What is ErEdit?What is ErEdit?

ErEdit is a Web form that allows users to ErEdit is a Web form that allows users to enter and update certain electronic enter and update certain electronic resources in our databases.resources in our databases.

Without the appropriate resource entries Without the appropriate resource entries the Library Search engines will NOT find the Library Search engines will NOT find your electronic resource and the proxy your electronic resource and the proxy server will not grant access to the resource server will not grant access to the resource URL.URL.

It is imperative that entries in ErEdit be It is imperative that entries in ErEdit be accurate in order to work with other Library accurate in order to work with other Library Systems. Systems.

ErEdit CourtesyErEdit Courtesysee: http://www.library.uiuc.edu/eredit/help.htmlsee: http://www.library.uiuc.edu/eredit/help.html

The Systems Office has made ErEdit open and The Systems Office has made ErEdit open and available to anyone with the appropriate Web available to anyone with the appropriate Web editing permissions in the UIUCLibrary domain.editing permissions in the UIUCLibrary domain.

This means that anyone can edit, delete, or add This means that anyone can edit, delete, or add resources in our databases.resources in our databases.

Resources are typically the responsibility of the Resources are typically the responsibility of the sponsoring Library.sponsoring Library.

You should notify the resource contact (Listed in the You should notify the resource contact (Listed in the Contact field of the ErEdit page) if you suspect Contact field of the ErEdit page) if you suspect errors with their entry.errors with their entry.

Any changes made to a resource entry will be Any changes made to a resource entry will be recorded as being made by you (see the footer of recorded as being made by you (see the footer of the ErEdit page). You are responsible for notifying the ErEdit page). You are responsible for notifying the contact regarding your changes. The contact the contact regarding your changes. The contact should ALWAYS be informed when changes to their should ALWAYS be informed when changes to their resource are made. resource are made.

ErEdit ProtocolErEdit Protocolhttp://www.library.uiuc.edu/eredit/help.htmlhttp://www.library.uiuc.edu/eredit/help.html

You should be intimately familiar with You should be intimately familiar with how ErEdit operates and what it how ErEdit operates and what it does BEFORE attempting to edit does BEFORE attempting to edit resources. resources. http://www.library.uiuc.edu/eredit/help.htmlhttp://www.library.uiuc.edu/eredit/help.html

You should let the Systems Office You should let the Systems Office know immediately if you have a know immediately if you have a resource that returns an error in the resource that returns an error in the Proxy Test. Proxy Test. http://www.library.uiuc.edu/proxy/test/test.asphttp://www.library.uiuc.edu/proxy/test/test.asp (Remember, when a patron in Chile can not access (Remember, when a patron in Chile can not access a resource they call us, not you!)a resource they call us, not you!)

Designing for the Web Designing for the Web

Function vs. FormFunction vs. Form

Web ConceptsWeb Concepts

Function before Form. While we do Function before Form. While we do not wish to squash the creative not wish to squash the creative process, we must first consider our process, we must first consider our audience and meet the Library and audience and meet the Library and University our obligations. University our obligations.

Make sure that any additions you Make sure that any additions you make to your pages are ADA make to your pages are ADA compliant and that they are compliant and that they are absolutely necessary to your Library absolutely necessary to your Library mission.mission.

Considerations for DesignConsiderations for DesignYou should consider the following when designing for the Web:You should consider the following when designing for the Web:

Avoid duplication. Often Libraries provide several links to the Avoid duplication. Often Libraries provide several links to the same resource. Links should be thoughtfully placed to provide same resource. Links should be thoughtfully placed to provide the greatest usability. Duplication not only wastes space, it the greatest usability. Duplication not only wastes space, it serves to confuse your users.serves to confuse your users.

Content should be considered above aesthetics. Avoid letting Content should be considered above aesthetics. Avoid letting imagery supercede content. Patrons want the facts and should imagery supercede content. Patrons want the facts and should not have to scroll around your Library’s icon in order to reach the not have to scroll around your Library’s icon in order to reach the content.content.

Images are nice, just make certain they load quickly (compress Images are nice, just make certain they load quickly (compress them). Remember we are “above average” when it comes to them). Remember we are “above average” when it comes to network speed. Most users off-campus are at a disadvantage network speed. Most users off-campus are at a disadvantage when downloading Web content.when downloading Web content.

http://www.widearea.co.uk/designer/compress.htmlhttp://www.widearea.co.uk/designer/compress.html

Be certain of your needs before adding “flash”.Be certain of your needs before adding “flash”. We will not allow you to run custom scripts on our servers.We will not allow you to run custom scripts on our servers. Are you compliant?Are you compliant?

Web editors and Web editors and WYSIWYGsWYSIWYGs

What to use to edit your codeWhat to use to edit your code

Web editorsWeb editors

The Library Systems Office does NOT The Library Systems Office does NOT support ANY proprietary Web editor. support ANY proprietary Web editor.

Web editors can be had for a licensing fee Web editors can be had for a licensing fee (charged to the ordering library) and the (charged to the ordering library) and the Library Systems Office will install the Library Systems Office will install the software on your Library computer.software on your Library computer.

The most common Web editors The most common Web editors (WYSIWYG) in use around the Library are (WYSIWYG) in use around the Library are Dreamweaver and Frontpage.Dreamweaver and Frontpage.

A complete listing of available Web editors A complete listing of available Web editors can be found at:can be found at:

https://wwws1.library.uiuc.edu/webguide/https://wwws1.library.uiuc.edu/webguide/editorcomp.html editorcomp.html

Training Training

Sharpening skillsSharpening skills

Where to find Web help.Where to find Web help.

The University provides free training in Web The University provides free training in Web development to both Staff and Students. development to both Staff and Students. XtremeLearning provides online or downloadable XtremeLearning provides online or downloadable courses on everything from authoring a resume to courses on everything from authoring a resume to C++ programming. You can register for training at:C++ programming. You can register for training at:

http://www.uillinois.edu/xtremelearning/http://www.uillinois.edu/xtremelearning/

For a fee training:For a fee training: The best source for instructor led training that we've The best source for instructor led training that we've

found on campus is through the FAST-3 courses. found on campus is through the FAST-3 courses. These courses are offered by the Office of These courses are offered by the Office of Instructional Resources. Recent course offerings Instructional Resources. Recent course offerings include: Web & HTML Workshop, Web Page include: Web & HTML Workshop, Web Page Design using HTML, Front Page, and Design using HTML, Front Page, and Dreamweaver. These courses are open to anyone, Dreamweaver. These courses are open to anyone, but the individual is responsible for registering and but the individual is responsible for registering and the department must cover any course fees. the department must cover any course fees. 

Other HTML ResourcesOther HTML Resources

HTML goodies - http://www.htmlgoodies.com/HTML goodies - http://www.htmlgoodies.com/This is an excellent site that provides HTML primers and tutorials for both This is an excellent site that provides HTML primers and tutorials for both basic and complex HTML. The guide is straightforward and in plain basic and complex HTML. The guide is straightforward and in plain English.English.

A Beginner's Guide to HTML - A Beginner's Guide to HTML - http://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimer.htmlhttp://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimer.htmlBrought to you by NCSA, this is a very good tutorial for those just starting Brought to you by NCSA, this is a very good tutorial for those just starting to learn how to create web pages.to learn how to create web pages.

   W3C's HTML Home Page - http://www.w3.org/MarkUp/W3C's HTML Home Page - http://www.w3.org/MarkUp/

The World Wide Web consortium (W3C) is an international consortium of The World Wide Web consortium (W3C) is an international consortium of companies involved with the Internet and the Web. The organization's companies involved with the Internet and the Web. The organization's purpose is to develop open standards so that the Web evolves in a single purpose is to develop open standards so that the Web evolves in a single direction rather than being splintered among competing factions. The direction rather than being splintered among competing factions. The W3C is the chief standards body for HTTP and HTML. This site is best W3C is the chief standards body for HTTP and HTML. This site is best used if you want to know more of the nitty-gritty details behind HTML.used if you want to know more of the nitty-gritty details behind HTML.

   HTML Pocket ReferenceHTML Pocket Reference by Jennifer Neiderst. Published by O'Reilly in by Jennifer Neiderst. Published by O'Reilly in

December, 1999. This pocket reference delivers a concise guide to every December, 1999. This pocket reference delivers a concise guide to every HTML 4.0 tag. It also contains detailed information on the tag's attributes HTML 4.0 tag. It also contains detailed information on the tag's attributes as well as browser support information. Please note: this is designed as a as well as browser support information. Please note: this is designed as a reference tool and will not tell you everything about HTML.reference tool and will not tell you everything about HTML.

Website Structure and Website Structure and MaintenanceMaintenance

Common questions answeredCommon questions answered

Where can I test my HTML Where can I test my HTML code / identify errors?code / identify errors? The W3 provides an HTML validation The W3 provides an HTML validation

service at:service at:http://validator.w3.org/http://validator.w3.org/

You should remember to choose “HTML You should remember to choose “HTML 4.01 Transitional” before submitting your 4.01 Transitional” before submitting your URL.URL.

The returned statement will tell you exactly The returned statement will tell you exactly in the code (by line number) where your in the code (by line number) where your HTML code is erroneous.HTML code is erroneous.

You should always check your code before You should always check your code before calling the Systems Office for help.calling the Systems Office for help.

Is it possible to find out how many people Is it possible to find out how many people have access my Web pages?have access my Web pages?

Currently, the best way to get statistics on your library's pages is Currently, the best way to get statistics on your library's pages is to go to the transacts.asp page in your library's web directory and to go to the transacts.asp page in your library's web directory and follow the instructions provided on the page. The Webserver no follow the instructions provided on the page. The Webserver no longer supports counters because they can consume significant longer supports counters because they can consume significant Webserver resources, particularly when used to excess. As a Webserver resources, particularly when used to excess. As a result, the transaction logs are the only available method for result, the transaction logs are the only available method for ascertaining the number of hits to your pages.ascertaining the number of hits to your pages.

Please keep in mind the following:Please keep in mind the following: The transaction logs do not record what users do on any The transaction logs do not record what users do on any

particular page, they only note that the page has been visited.particular page, they only note that the page has been visited. Frequently library staff (i.e. Systems Office or Reference) will Frequently library staff (i.e. Systems Office or Reference) will

have the need to access your pages, so the number of hits you have the need to access your pages, so the number of hits you receive for any particular page might be skewed. receive for any particular page might be skewed.

Please link to the following URL. Please link to the following URL. https://www-s1.library.uiuc.edu/transacts/transacts.asphttps://www-s1.library.uiuc.edu/transacts/transacts.asp

On this page there is a field to enter the URL route you want to On this page there is a field to enter the URL route you want to check. Be sure to enter your units directory name in that field. check. Be sure to enter your units directory name in that field. Example: To check the Chemistry Library transactions you would Example: To check the Chemistry Library transactions you would enter the /chx in the box so it would read: enter the /chx in the box so it would read: http://www.library.uiuc.edu/chx http://www.library.uiuc.edu/chx

What is the difference between a What is the difference between a default.asp and index.html page?default.asp and index.html page?

The "home", "default", or "main" page in your directory is the one The "home", "default", or "main" page in your directory is the one that the user will get if he or she just types in the directory name that the user will get if he or she just types in the directory name and does not specify a filename. For example, if she typed: and does not specify a filename. For example, if she typed: http://www.library.uiuc.edu/ahx/ then that would retrieve the http://www.library.uiuc.edu/ahx/ then that would retrieve the page: http://www.library.uiuc.edu/ahx/default.asppage: http://www.library.uiuc.edu/ahx/default.asp

   Why default.asp? Our webserver has made extensive use of .asp Why default.asp? Our webserver has made extensive use of .asp

(active server pages) and we therefore chose the default.asp as (active server pages) and we therefore chose the default.asp as the main default page for our system. the main default page for our system.

Different systems will have different names for the "home" page. Different systems will have different names for the "home" page. Our old Webserver used the name "default.htm" and then Our old Webserver used the name "default.htm" and then "default.asp" to retrieve this page. But recently, June 2002, we "default.asp" to retrieve this page. But recently, June 2002, we changed our design and the default can now be index.html or changed our design and the default can now be index.html or index.htm and it will still look for default.asp. This also works on index.htm and it will still look for default.asp. This also works on subdirectories. If the user types in: subdirectories. If the user types in: http://www.library.uiuc.edu/mdx/books/ then she will retrieve the http://www.library.uiuc.edu/mdx/books/ then she will retrieve the "default" page in that subdirectory (assuming that there is one)."default" page in that subdirectory (assuming that there is one).

What is an ASP page? How does it What is an ASP page? How does it differ from an HTML page?differ from an HTML page?

An ASP page can be edited almost like any other HTML file. While the file An ASP page can be edited almost like any other HTML file. While the file extension for an HTML page is either .html or .htm, the extension for an extension for an HTML page is either .html or .htm, the extension for an ASP page is .asp Basically, the "asp" extension tells the Webserver that ASP page is .asp Basically, the "asp" extension tells the Webserver that there is a combination of HTML code and scripting code in the file. ("ASP" there is a combination of HTML code and scripting code in the file. ("ASP" stands either for "Active Server Page" or "Active Server Platform," stands either for "Active Server Page" or "Active Server Platform," depending upon the source consulted.) If you "View Document Source," depending upon the source consulted.) If you "View Document Source," only the HTML code will be displayed. If you open up the same web page only the HTML code will be displayed. If you open up the same web page from your web share directory using Notepad, you will see both the from your web share directory using Notepad, you will see both the scripting code and the HTML code. For this reason, if you use Netscape scripting code and the HTML code. For this reason, if you use Netscape or FrontPage to grab the web page directly from the Web (rather working or FrontPage to grab the web page directly from the Web (rather working from a backup copy on your hard drive) and then press the Edit button, from a backup copy on your hard drive) and then press the Edit button, you will not be editing the original ASP page, the one containing both you will not be editing the original ASP page, the one containing both types of code.  types of code.  

What are the options for editing an ASP page?What are the options for editing an ASP page?    FrontPage generally preserves the ASP code when you edit although it FrontPage generally preserves the ASP code when you edit although it

has difficulty with certain local database pages, provided you opened the has difficulty with certain local database pages, provided you opened the page in the Editor by specifying a filename, rather than a URL. If you save page in the Editor by specifying a filename, rather than a URL. If you save your web page temporarily as an html document and then edit in your web page temporarily as an html document and then edit in Netscape, it will convert all the ASP code into plain text on the screen. Netscape, it will convert all the ASP code into plain text on the screen. This code will be visible to everyone, rather than being hidden. When This code will be visible to everyone, rather than being hidden. When editing ASP pages, it is best to use Notepad or another plain text editor. editing ASP pages, it is best to use Notepad or another plain text editor. Otherwise, you will need to copy and paste all the ASP code back into Otherwise, you will need to copy and paste all the ASP code back into your file after editing in Netscape.your file after editing in Netscape.

How often should I check the links How often should I check the links on my web pages?on my web pages?

You really should check for dead links on You really should check for dead links on your web pages at least a couple of times your web pages at least a couple of times every semester. This can be done by hand every semester. This can be done by hand or by using link checking software. While or by using link checking software. While such software is not usually available for such software is not usually available for free, a search on http://www.yahoo.com for free, a search on http://www.yahoo.com for "link checking software" yielded over 2100 "link checking software" yielded over 2100 hits. Some of these pages provide a demo hits. Some of these pages provide a demo version of their software that you can use version of their software that you can use to check your site. Additionally, the library's to check your site. Additionally, the library's Webserver has the capability to check links Webserver has the capability to check links and we do this for all units twice a year. We and we do this for all units twice a year. We would recommend checking them yourself would recommend checking them yourself more often to expedite matters.more often to expedite matters.

How can I make my pages better How can I make my pages better indexed?indexed? Use an informative, descriptive title. Use an informative, descriptive title. 

Almost any search on http://www.library.uiuc.edu/sitesearchg.asp will Almost any search on http://www.library.uiuc.edu/sitesearchg.asp will bring up web pages with the title "Untitled" or "test.htm" These titles do not bring up web pages with the title "Untitled" or "test.htm" These titles do not give the user any useful information. The title that appears between the give the user any useful information. The title that appears between the <TITLE></TITLE> tags will appear at the top of the browser. In Netscape, <TITLE></TITLE> tags will appear at the top of the browser. In Netscape, the title appears in white lettering in the blue bar at the top of the screen. the title appears in white lettering in the blue bar at the top of the screen. The title is different from the filename or from the header. For example, The title is different from the filename or from the header. For example, look at the web page: http://www.library.uiuc.edu/announce/resource.htm look at the web page: http://www.library.uiuc.edu/announce/resource.htm The title of this page is: New Resources at the UIUC Library. The filename The title of this page is: New Resources at the UIUC Library. The filename is resource.htm. The header which appears between two <H2></H2> tags is resource.htm. The header which appears between two <H2></H2> tags is: New Resources. is: New Resources.

Use meta tags.  The search engine uses <META> tags to present Use meta tags.  The search engine uses <META> tags to present information. Specifically, it uses these four tags: information. Specifically, it uses these four tags:

<META NAME="DESCRIPTION" CONTENT="Use this form to search the <META NAME="DESCRIPTION" CONTENT="Use this form to search the International ALA Archives.">International ALA Archives."><META NAME="AUTHOR" CONTENT="T. W. Cole"><META NAME="AUTHOR" CONTENT="T. W. Cole"><META NAME="KEYWORDS" CONTENT="query, search, ALA, <META NAME="KEYWORDS" CONTENT="query, search, ALA, American Library Association, archives">American Library Association, archives"><META NAME="SUBJECT" CONTENT="search form for International <META NAME="SUBJECT" CONTENT="search form for International ALA Archives">ALA Archives">

It will use the description as the entire abstract in the results listing. It It will use the description as the entire abstract in the results listing. It doesn't actually show the user the other <META> tags, though there is doesn't actually show the user the other <META> tags, though there is probably a way around this. If you don't use the <META> tags, then it gets probably a way around this. If you don't use the <META> tags, then it gets interesting. It lists the title in between the <TITLE></TITLE> tags, any interesting. It lists the title in between the <TITLE></TITLE> tags, any information in the "alt" tag part of <IMG SRC...>, and regular text, all information in the "alt" tag part of <IMG SRC...>, and regular text, all pretty much in the order it appears on the page.pretty much in the order it appears on the page.

Should I remove outdated pages Should I remove outdated pages from the Webserver? Why?from the Webserver? Why?

It is important to remember when designing web It is important to remember when designing web pages that users will find your pages in a number of pages that users will find your pages in a number of ways. Some users may start at your home page ways. Some users may start at your home page and work their way carefully through the other and work their way carefully through the other pages in the orderly fashion that you intended. pages in the orderly fashion that you intended. However, other users will be using search engines However, other users will be using search engines to access your pages. This is especially likely with to access your pages. This is especially likely with the search feature available from the main Library the search feature available from the main Library web page web page [http://www.library.uiuc.edu/sitesearch.htm]. We do [http://www.library.uiuc.edu/sitesearch.htm]. We do receive email from users wondering about broken receive email from users wondering about broken links or outdated information on web pages that are links or outdated information on web pages that are not linked from any other web pages at UIUC. not linked from any other web pages at UIUC.

Remember - if a page is on the Webserver, it is Remember - if a page is on the Webserver, it is accessible to the world.accessible to the world.

Special ProjectsSpecial Projects

Advanced TopicsAdvanced Topics

Special Scripts (CGI, Perl)Special Scripts (CGI, Perl)

All CGI scripts must be approved by the All CGI scripts must be approved by the Library Webmaster and the Network Library Webmaster and the Network Analyst or appropriate System Analyst or appropriate System Administrator. You may write your own CGI Administrator. You may write your own CGI scripts or we may be able to modify an scripts or we may be able to modify an existing script to meet your needs. Most existing script to meet your needs. Most CGI scripts used at the Library are written CGI scripts used at the Library are written in Perl, though other languages are in Perl, though other languages are possible. You may also want to explore possible. You may also want to explore alternate methods of making active content alternate methods of making active content on your web pages, such as PHP or ASP on your web pages, such as PHP or ASP instead of CGI.instead of CGI.

Database creation and Database creation and accessaccess At the moment, the Library Systems Office cannot provide At the moment, the Library Systems Office cannot provide

widespread support for creating databases and access to them widespread support for creating databases and access to them via the Web. However, the Systems Office via the Web. However, the Systems Office must be informedmust be informed of of any such projects that are to be mounted on the Library any such projects that are to be mounted on the Library Webserver.Webserver.

Some questions to consider: Some questions to consider: What format is the data currently in? Plain text (ASCII)? Microsoft What format is the data currently in? Plain text (ASCII)? Microsoft

Access? Access? Who will be the primary user? Staff? Undergraduate students? Who will be the primary user? Staff? Undergraduate students?

Graduate students? Graduate students? Who will update the database? How often? Who will update the database? How often? Do you need to allow access for simultaneous users? Do you need to allow access for simultaneous users? What fields need to be searched? What fields need to be searched? How will searchers enter information? Entering free text? Or How will searchers enter information? Entering free text? Or

selecting items from menus? selecting items from menus? What should the search results page look like? Should it display What should the search results page look like? Should it display

one record at a time? All matching records? one record at a time? All matching records? How will help be accessed? How will help be accessed? If a person retrieves no records, what should the error message If a person retrieves no records, what should the error message

say? say? What is the projected size of the database?What is the projected size of the database?

Creating a form for an email Creating a form for an email account and generic email accountsaccount and generic email accounts

Currently, all libraries should have a generic email Currently, all libraries should have a generic email account and email form for their use. These forms account and email form for their use. These forms allow users to contact the library without providing allow users to contact the library without providing the library contact's personal email address. Since the library contact's personal email address. Since forms tend to rely heavily on the use of a mouse, be forms tend to rely heavily on the use of a mouse, be sure to provide an email address or alternate sure to provide an email address or alternate contact method for users.contact method for users.

If you have any questions about these forms please If you have any questions about these forms please contact the library webmaster. If you have a special contact the library webmaster. If you have a special need for a form, you can design one then contact need for a form, you can design one then contact the Library Webmaster so that a CGI script can be the Library Webmaster so that a CGI script can be modified to work with your form.modified to work with your form.

CD-Rom accessibilityCD-Rom accessibility

If your library purchased a CD-ROM there are two If your library purchased a CD-ROM there are two options for sharing the contents of the disk. The first options for sharing the contents of the disk. The first is to mount it locally on a PC in your library, but is to mount it locally on a PC in your library, but keep in mind that this will restrict use to users who keep in mind that this will restrict use to users who are physically in your library. Alternately, the are physically in your library. Alternately, the resource can be placed on the CD-ROM server for resource can be placed on the CD-ROM server for wider access. Before you contact the systems wider access. Before you contact the systems office, please find out if a Web-accessible version is office, please find out if a Web-accessible version is available. Many vendors are now providing this available. Many vendors are now providing this service and it is generally much easier to implement service and it is generally much easier to implement than the CD-ROM version. Please investigate any than the CD-ROM version. Please investigate any licensing (single- or multi-user) or access (restricted licensing (single- or multi-user) or access (restricted by IP, global, etc.) issues before contacting by IP, global, etc.) issues before contacting Systems. Systems.

NOTE: not all CDs can be mounted successfully.NOTE: not all CDs can be mounted successfully.