Web Resources for Developers

Introduction

This page contains information and links to resources for people developing or maintaining pages on the World Wide Web. Some of this information is specific to the Penn State computing network. This page was originally developed for use in LA-483 -- Computer Applications for the Liberal Arts II.

This page is located at http://cac.psu.edu/~santoro/283/www.html

The information in this page is also presented in the CAC seminar Introduction to Web Server Concepts

Overview

• overview of publishing on the Web
• review of client/server systems
• review of URLs
• locating a server
• security
• introduction to HTML
• where to find HTML editors and utilities
• icons, pictures and graphics
• mailto
• tables
• counters
• server-push, client-pull
• forms and CGI scripts
• advanced web features

Overview of publishing on the Web

• locate server
• create html and related items (graphics, scripts, etc.)
• place on server and test
• edit and maintain

Review of client/server systems

• server contains html and data objects
• client provides user interface and connects to server

• client connects to server
• downloads html or other data object
• invokes local program (viewer) to display object

• or may simply download object for later use

• For viewers and MIME info go to http://www-dsed.llnl.gov/documents/WWWtest.html

Review of URLs

• To learn about URL's check out http://www.ncsa.uiuc.edu/demoweb/url-primer.html

• good way to construct complicated URL's is to use your browser to get to object, then copy URL

Locating a server

There are a number of technical solutions to the problem of locating web server space. Here are a few possibilities. Please note that each of these options may have constraints.

• install server on own computer (requires LAN connection)
• obtain space on campus/department/college computer (if provided)
• obtain CAC Web server account. For more information check the CAC Web FAQ at http://www.psu.edu/publish/
• rent space from a commercial internet service provider (ISP)

  The best place to find out about web servers, commercial and free, is at the WWW FAQ located at http://www.boutell.com/faq/

Security

The WWW Security FAQ

Introduction to HTML

VIEW SOURCE can be one of the best ways to examine the HTML that goes into any web page

There are also a number of online manuals and tutorials, including:

• A Beginner's Guide to HTML located at http://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimer.html is one of the very best places to start
• An Interactive Introduction to HTML and CGI is located at http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/html.html
• Introduction to HTML located at http://members.aol.com/htmlguru/about_html.html

• HTML Quick Reference located at http://kuhttp.cc.ukans.edu/lynx_help/HTML_quick.html
• A compendium of HTML elements is located at http://www.synapse.net/~woodall/html.htm
• Here is the Indiana University Web Developers Guide located at http://www-slis.lib.indiana.edu/Internet/programmer-page.html

• Jay Newman, of the CAC ETS group, has developed two excellent seminars on HTML and Advanced HTML. The pages for these seminars are located at http://ets.cac.psu.edu/presentations/HTML/ and http://ets.cac.psu.edu/presentations/HTML2/

• Many more HTML guides and tutorials are available through the YAHOO catalog at http://www.yahoo.com/Computers_and_Internet/Software/Data_Formats/HTML/Guides_and_Tutorials/

Here are some examples of HTML source. Use the VIEW SOURCE command on your browser to examine them.

• A very simple page
• Headings
• Text formatting
• More text formatting and lists
• Anchors and graphics

There are standards in place (or being developed) for HTML revisions 2 and 3. Information on these specifications may be found at http://www.w3.org/hypertext/WWW/MarkUp/MarkUp.html#standard

Netscape Corp. has created a number of useful extensions to HTML 2.0 and 3.0. Here is a link to some references about Netscape HTML extensions

Of course style is important, so here are a few useful style guides:

• How to create high-impact documents From the folks at Netscape Communications
• Bad Style Page From earth.com, learn what not to do
• NCSA's list of Guides to Writing Documents A good list that gets you to a wide variety of documents on how-to write good HTML

Where to find HTML editors and utilities

• The World Wide Web Consortium has a page of Web and HTML tools located at http://www.w3.org/hypertext/WWW/Tools/Overview.html
• YAHOO is another good source, here is a link to its section on HTML
• The PC Magazine page has a nice section on HTML editors at http://www.zdnet.com/pcmag/IU/itools/reviews/editors.htm

Icons, pictures and graphics

Here is a simple example of graphics

Where to get graphics

• Scan them in
• Icon libraries
  • Here a link to the YAHOO listing of icon resources.
  • Here is a link to the WebCom Index of graphics and icons
• Copy them if directly selectable
• How to copy them if not directly selectable

Some pages have elaborate backgrounds, here is a link to a about making backgrounds located at http://www.cs.bgsu.edu/~jburns/backgrnd.html

Here is a link to the area on backgrounds at YAHOO

PC Magazine has a page with some graphics tools of use to Web developers located at http://www.zdnet.com/pcmag/IU/itools/reviews/graph.htm

Some browsers support GIF animations. Here is a link to a program and example for GIF animations GifBuilder

Clickable Maps

Clickable maps require a server with the ISMAP capability. (The Sun Cluster has this.) A good tutorial on clickable maps is the NCSA ImageMap tutorial, located at http://hoohoo.ncsa.uiuc.edu/docs/tutorials/imagemapping.html

Some pages make use of transparent images. These are graphics that conform to the background color of the user's browser. Here is a link to the YAHOO section on transparent images.

Mail-To

The mailto tag provides for the user to send you email. An example may be found in the signature at the bottom of this page. Use your browser VIEW SOURCE capability to examine the HTML.

Tables

Tables are an HTML 3.0 construct that allows for the creation of tabular data. Here is a link to some Netscape Documentation on Tables. A simple example of tables may be found in my hotlist.

Counters

Some web pages have counters. (An example is at the bottom of this page.) Normally this is done using scripts on your server. However there are also a number of online services that provide page counters for free. Here is one such service located at http://www.digits.com/web_counter/create.html

Server-push, client-pull

HTML R3.0 has a META tag that allows for some interaction between the page and the client or server. For client-pull this is

An example of client-pull may be found at http://ripsaw.cac.psu.edu/statpage/status.html.

An example of server-push may be found at http://www.netscape.com/assist/net_sites/pushpull.html

Forms and CGI Scripts

Forms are ways for a web page to get input from a user. An example may be found at http://dtpserv.cac.psu.edu/cgi-bin/register.cgi

Forms require that a program (called a CGI script) be written to handle the incoming data stream from the form and to create the outgoing HTML response.

Here are some links to tutorials on forms:

• Web Communications forms tutorial.
• Here is Carlos forms tutorial.
• Here is another tutorial on writing forms.

• Also, check out Jay Newman's Advanced HTML page at http://ets.cac.psu.edu/presentations/HTML2/

Common Gateway Interface

CGI is the set of protocols that allow a web page to interact with a program located on the server computer. This program could provide an interface to a database, graphics library or any other function as deemed by the programmer. You have to either write the program or obtain a program from a source library. Either way some programming knowledge will likely be necessary to utilize CGI.

Here are some useful CGI references:

• The Common Gateway Interface, -- a tutorial on CGI

• The CGI Collection is a central location of CGI information and scripts.

• Perl, Visual Basic and Apple Script are popular programming languages for CGI script authoring. Here is a link to the YAHOO section on Web programming

Advanced web features

Many advanced features are being created for the Web. Here are links to a few of them:

• Advanced Netscape features
  • Frames

• Virtual Reality Modeling Language (VRML)
  • http://www.sd.tgs.com/~template/Links/vrmllinks.html for Virtual Reality Modeling Language links
  • Many VRML resources at http://www.yahoo.com/Computers_and_Internet/Internet/World_Wide_Web/Virtual_Reality_Modeling_Language__VRML_/

• Java
  • http://java.sun.com/ for JAVA and HotJAVA
  • Java resources at http://www.yahoo.com/Computers_and_Internet/Languages/Java/
  • JavaScript resources at http://www.yahoo.com/Computers_and_Internet/Languages/JavaScript/

• Netscape JavaScript Resources

• Netscape Plug-Ins
  • Netscape Plug-Ins

Summary

• the web is the best place for documentation, shareware, etc. regarding web development
• CAC, through its Consulting and ETS groups, host a number of Web development seminars each semester and can offer consulting assistance. Here is a link to the CAC Seminar Information
• many books and magazines are now available regarding the Web, these are a must for web developers
  • Internet World Magazine
  • HotWired

• many NETNEWS newsgroups and/or LISTSERV lists exist for discussion of Web development. One nice list is the Advanced HTML list, whose collection may be found at http://risc.ua.edu/adv-html/ To subscribe to this list send a LISTSERV subscribe command to LISTSERV@UA1VM.UA.EDU.

• Here is a link to the HTML: Writers Guild

Have Fun!