Free Access! Your Technology Information Source

If the site is too slow, use one of our mirrors:  MIRROR 1  |  MIRROR 2

Web Design Primer
NOTE:  This is not meant to be a comprehensive list of all relevant Web resources, but if you know of a good site that you think should be included here, please write to [email protected] with the site name, URL and a brief description.

HTML and WEB BASICS

Some Definitions (and acronym expansions)

WWW
WorldWide Web (also abbreviated W3, or "the Web"). The Web can be thought of as a subset of the Internet. WWW documents may contain text, images, movies and sound as well as "links" to other WWW documents. This means of linking documents (and other kinds of information) is called "hyper-text" (or, more accurately, "hyper-media"), since the linked documents form, in effect, a non-linear "text" in which the various elements can be experienced (or not) in whatever order the "reader" chooses. To say that something is "on the Web" means that it resides on a computer running web server software and that it can be accessed and viewed with a web browser.
Browser (or Web Browser)
software used to access WWW documents. They read and interpret text files containing HTML tags and can also display images and other kinds of multimedia. Some of the more well-known browsers are Netscape, Microsoft Internet Explorer and Lynx. Internet Explorer and Netscape are examples of "graphical browsers" since they can display images, while Lynx is a "non-graphical" (or "text-only") browser, often available on a campus dial-up system.
URL (uniform resource locator)
a web address. For example, the URL of the document you're looking at now used to be

http://miamimoo.mcs.muohio.edu/~bonefas/www_prim.html

The http: means that the document resides on a web server (http = hypertext transfer protocol), rather than some other kind of server (e.g. a gopher or ftp server). miamimoo.mcs.muohio.edu is the computer where the document resides (AKA the "host"). ~bonefas is the directory on that computer where the document is stored (the tilde means that the directory is under the user's home directory rather than in the main web document tree), and www_prim.html is the name of the file itself. On most web servers, the names of files conventionally end with .html (.htm on DOS/Windows servers).

HTML
Hyper Text Markup Language. In order for texts to appear correctly formatted on a Web browser, they must be "marked up" in accordance with HTML conventions. Web documents are not WYSIWYG (what you see is what you get) like the documents you produce with word processing applications such as MS Word or Word Perfect, but instead must include explicit "tags" indicating how the text will be displayed (e.g. bold, indented, heading size). There are also codes for special characters such as letters with accents.
HTML tags are always enclosed in pointed brackets, and often come in pairs, with a beginning tag telling the browser where to start special formatting and an ending tag (same as the beginning tag but preceded by a slash, /,) indicating where the formatting ends. E.g. the following marked up text,

   this text is normal, while <i>this is in italics</i>

would appear in a web browser as

   this text is normal, while this is in italics ,

the <i> being the beginning tag for italics and the </i> being the ending tag.

For more on tags, see the HTML guides below.

Code Appropriation: If you see a web page you want to emulate, you can always see its html code using "View Source" (found under the "View" menu in Netscape Navigator and MS Internet Explorer). This enables you to see how anyone did anything in their pages (well, most everything, although some of a page's functionality can be the result of programs on their server that you can't see). Better yet, you can copy and paste someone's html code into your own page, of course giving the appropriate credit for javascripts and such.

For MORE general information about the Internet and the Worldwide Web, see:

 Searching the Web

There are many more search engines out there, but these should get you started!

  • Google has a new angle on returning not only relevant but also important results
  • Altavista
  • HotBot
  • Northern Light
  • Yahoo (listing by category rather than a search engine)
  • Ask Jeeves (a "natural language search service" that incorporates a meta-search of several search engines)

 Some HTML and Web Development Guides and Tutorials

 HTML converters, editors and other tools

  • Links to HTML CONVERTERS from W3 (for converting existing files to html)
  • HTML EDITORS (most of these sites let you download a trial version of the product and/or purchase it on-line)
    Non-WYSIWYG HTML Editors
    • BBEdit for Mac is a powerful text editor for which html extensions are available that make markup simpler. There is also a free version called BBEdit Lite (click on the "Free stuff" link).
    • HTMLPad for Windows FREEware, is like a souped-up version of NotePad, with built-in HTML features

    WYSIWYG HTML Editors

    • Page Spinner for MAC, shareware
    • Hot Dog Pro for WINDOWS (commercial, WYSIWYG, with lots of features)
    • SoftQuad's HoTMetaL PRO for WINDOWS (another popular commerical web page authoring package)
    • Home Page (formerly known as "Claris Home Page") commerical product for MAC and WINDOWS
  • MORE

     Checking your HTML

    These services check the validity of the HTML syntax in your documents. Using a commercial HTML editor is no guarantee that your HTML will be "good", especially if you make revisions often, or use more than one editor. Just because your HTML "works" doesn't mean it's good, and what works now could break when newer browsers are released (or might already be broken in browsers other than the one you use).

 FTP: Software for copying files to a web server

In order to get an HTML file that you created "onto" the web, you need to copy it from your local computer to your account on a computer that is acting as a web server. This is generally done via FTP, file transfer protocol. Thus, you either need a specialized FTP program (like the ones linked below) or an html editor with built in FTP capabilities (many of the latest ones have this feature). When you copy a file from your computer to a server, you are uploading it; copying it off a server onto your local computer is called downloading.

ADVANCED HTML (and more general text encoding)

N.B. : Many of the most recent html editors provide a point-and-click alternative to the manual coding methods discussed at these sites for tables, frames and forms.

TABLES:

FRAMES: Charlton Rose's Frames Tutorial (but before you decide to put up that page with frames, you might want to read Jakob Nielson's column on Why Frames Suck)

FORMS:

PASSWORD PROTECTING WEB PAGES: (Note: this is for CERN, NCSA or Apache web server software -- ask your web site admin if you don't know what your school uses)

SERVER-SIDE INCLUDES (SSI): CGI Programming on the World Wide Web Chapter 5 of a book by Shishir Gundavaram

INTERACTIVITY AND DYNAMIC PAGES

CGI (Common Gateway Interface) Scripts and Scripting

Java and Javascript

SGML (standard generalized markup language) and XML (extensible markup language)

CSS (Cascading Style Sheets) and CSS Positioning

CSS and DHTML (see below), supported by the latest versions of Microsoft's and Netscape's browsers, allow more control over page layout than plain old HTML

DHTML (Dynamic HTML)

Last Updated: Monday September 13, 1999
All trademarks or product names mentioned herein are the property of their respective owners.

If you would like additional information about this page, please e-mail [email protected].

Design Copyright � 1999 Free Access.