Directory Structure: It is important that you organize all documents for your web site in a logical file structure on your local computer. All documents for your web site must be contained in a single folder (directory) that contains logical sub-folders (sub-directories). For example, your main folder can be called public_html, and inside it you will house your home page (index.html) and folders containing other related files (documents, graphics,midi, movies).
Directory structures should match: The file/folder structure on your web server should match the file structure on your local computer. If you upload the entire contents of your web site folder from your local computer to your public_html directory, the structures will be identical and confusion regarding file location will be minimized.
Internal links: Internal links are those that link you to other files within your own web site (in your own account). All internal links should be relative links, rather than absolute. This will be simple if you have saved all related files within sub-directories of your main web page directory (folder). Thus, a link to document on Yosemite National Park in your documents folder should appear as: documents/Yosemite as rather than a complete (absolute) address such as: http://www.csun.edu/~vceed002/parks/documents/Yosemite.
Moving Your Web Site: Moving your web site from one Internet provider to another is a simple thing if you stored all of your files in one folder (and appropriate sub-folders), and if all of your internal links are relative. You can use FTP software to move your folder between providers, and simply change the address of the home page. If all pages are linked by relative links, there will be no confusion when installed on the new server. If however, you made the mistake of using absolute links (those that include the entire URL), your site will include dead links because the original directory path no longer exists. For example, a the relative address of a document called "Yosemite" in a documents folder will remain documents/Yosemite, regardless of location, but the URL will change. For example, if you moved your directory from CSUN server to and UCLA server, the URL will change from http://www.csun.edu/~vceed002/parks/documents/Yosemite to http://www.ucla.edu/~vceed002/parks/documents/Yosemite. As a result, all absolute links (those specifying the entire address) will be dead.
Creating a directory (public_html) for your web site: Make a folder entitled: public_html on your web server. All the files in your web site should be placed into this folder. The command for making new folders in mkdir.
Uploading files to web server: Use Fetch or other FTP (file transfer protocol) software to upload the contents of your web site folder on your local machine to your account on the web server. Most newer software allows you to upload (put) or download (get) entire folders. Note: all files should be transferred as raw data and placed in the public_html directory.
Granting file privileges: By default, only the account owner (you) can read, write or execute files in your account. If you receive a "Forbidden" message when trying to access a file on the web, it indicates that the owner has not granted you read and execute privileges. In the root directory, type: chmod -R o+rx public_html. This changes the mode (chmod) of all files (-R) in your web site (public_html) so that others (o) have read (r) and execute (x) privileges. This command should be repeated every time new files are added into your folder. The command can be more specific. For example, chmod -R o+rx public_html/documents would simply update the privileges for all files in the document directory.
- give public access to files
- (1) chmod o+r public_html/*.*
- (2) chmod -R o+rx public_html
- Other Important unix commands
- change directory: cd e.g. cd/public_html
- remove directory: rmdir e.g. rmdir/public_html
- long list: ll
- short list: ls
- disk space quota: quota -v
Viewing the files in your account: you can view the titles of all of your files using Fetch. You may also view them from the csun> prompt by typing ll (long list). This will list all files and show the privileges associated with each.
Web-site development tools: There is virtually no reason to code your web site in HTML (hypertext mark-up language, the language of the web) since the advent of web-site development tools such as Claris Home Page, Microsoft Front Page or Page Mill. These tools make web page development as simple as word processing. In the College of Education we use Claris Home Page for Macintosh. It can be found with the following path: Dell Server/Internet/Internet tools/Claris Homepage 2.0 (or higher).
Inputting text: A word processor is much more efficient than a web development tool for inputting and editing text. Do all of your writing in a word processor, and then simply copy and paste your text into an open HTML document. Newer versions of some word processors (e.g. Office 97) contain an option that converts text immediately into HTML coding, keeping all of your original formatting (bold, underline, indents, etc.). If you use older software, you will need to add the formatting using the web-site development software. Although most new web-site development tools contain spell checkers, it is better to check grammar, style and spelling in your word processor.
Formatting: To format text, first highlight it and then apply the appropriate formatting (color, bold, italics, headings, etc.).
Making a link: Highlight the text for a link and then click on the link tool to create a link. Most of the time you will want to simply paste in the link of a URL to establish a link.
Local link: All of your own files should be linked simply by giving the relative path (not the complete URL). For example, to link to a file called Yosemite.html in your documents folder, simply type in documents/Yosemite.html in your URL box.
External link: For external links (those outside of your account), you will need to give a complete URL. For example, if you want to reference the NASA web site, enter the URL: http://www.nasa.gov.
Links to Anchors: Often you will want to link to other sections on the same page, or to specific portions of another page. First insert an anchor at the point that you want to link. Give the anchor a logical name. All links to anchors begin with a pound sign. For example, to link to a section on your page that talks about Half Dome, you would have a link that reads #HalfDome. To access this portion of the page from another page, it is necessary to give the appropriate path. For example: documents/Yosemite#HalfDome (relative, internal link) or http://www.csun.edu/~vceed002/ Yosemite#HalfDome (external, absolute link)
email link: To establish an email link, your link should read: mailto:userName@host (e.g. norm.herr@csun.edu). A single link may be used for an entire mail group. For example, mailto: george.washington@csun.edu,abe.lincoln@csun.edu,teddy.roosevelt@csun.edu will send mail to three individuals simultaneously.
Acceptable File types: All pictures should be prepared as GIF files or JPG files.
JPEG (.jpg): (Joint Photographers Expert Group) A high-end compression image format mainly used for placing graphics on the Internet JPEG supports true color images
GIF (.gif): Graphics Interchange Format, a file format commonly used with graphics or photos displayed on Web documents.
File Extensions: The extension at the end of a file name tells what kind of file it is. Thus, all graphics should have a .jpg or .gif suffix. (e.g. yosemite.jpg; halfdome.gif)
Converting Graphics to GIF or JPG: Many graphics programs save files using TIFF, EPSF, or PICT formats. If your scanner, screen capture utility, or graphics program is not capable of saving files as GIF or JPG, it will be necessary to use a graphic conversion program to change them into JPG or GIF. Two common shareware programs for the Macintosh platform are GIF Converter and Graphic Converter.
TIFF (.tif): Tagged Image File Format, a format for storing computerized image files.
PICT (.pic): A QuickDraw Picture file routine used by many drawing and painting programs. Screen captures are saved as PICT files.
EPSF (.eps): Encapsulated PostScript Format files store images in two formats (PICT and PostScript). PICT is used for the screen display, PostScript for the printing.
Using CilpArt, Sounds, Movies and Backgrounds from the Web. Numerous sites provide public domain files to augment your web page. If you find a graphic that you like, simply hold down the mouse button for two seconds until a menu appears that allows you to save the file into the appropriate folder in your web site folder (graphics, MIDI, Movie, etc.). The files are saved on your computer in the same format they were originally saved on the web site from which you downloaded them.
Graphics on Web Page: Use the graphics tool to establish a relative link to a graphics file in the graphics folder of your web site. Graphics files will only appear on the web once you have uploaded your entire graphics folder and given others privileges to read and execute these files. It should be noted that graphics files are note embedded in the web page, but simply referenced by the web page. Thus, when you preview the page with graphics in your browser you are looking at more than one file (text and graphics files).
Animated GIFS: An animated GIF is a brief sequence of pictures that simulates motion. For example, a picture of the world may appear to rotate if a series of ten GIF images (each slightly rotated from the previous one) are shown in rapid succession. Although you can make your own animated GIFS, there are numerous sites on the web where you can download existing ones.
Formatted files (PDF): You may wish to post formatted data (e.g. data tables, etc.) on the web. Such documents can be saved as PDF (Page Description Format) files using Adobe Acrobat, and then viewed after downloading using Adobe Acrobat Reader. The documents contain all of the original formatting features
Making Image Maps:
- Three files are required to make an image map
- The html page calls up the gif file and the associated map file (see html code below)
- (1) GIF FILE:
- use .gif extension.
- Uploaded as raw data
- Create a graphic file in GIF format (Use a graphic conversion program to convert to GIF if it is not already in that format.
- (2) MAP FILE
- use .map extension.
- This must be uploaded as a text file; make sure that ends with .map, not txt!
- Open the graphic file using WebMap or other image map software.
- Export imagemap.map file.
- (3) HTML FILE
- uploaded as raw data
- use .html extension.
- This is sample html for a file that brings up the image map
- <html>
- <head>
- <title>Title</title>
- </head>
- <body>
- <h1><center>Title</h1>
- <A href="http://www.csun.edu/cgi-bin/imagemap/~vceed002/graphic.map">
- <center><IMG SRC="graphic.gif" BORDER=0 ALIGN=CENTER ISMAP></center></A>
- <p>
- <hr size=4>
- </body></html>
ACROBAT: Allows a user to save format. A reader utility is required to view documents with graphics. User cannot alter the document. : Portable document software developed by Adobe Systems, Inc.
ANONYMOUS FTP: FTP (File Transfer Protocol) is a common way to connect to a network, access directories, or obtain files. Usually requires a password and user name.
ASCII: American Standard Code for Information Interchange. ASCII is a binary code that represents characters. It allows computers from different platforms to display, transmit and print textual information.
AT&T). Its TCP/IP protocols are integral to the Internet.
AU: A type of sound format widely used for Unix computers.
BIN: Abbreviation for binary. All input to a computer is binary. Binary means made up of two parts. The two parts are combinations of O and 1 data bits. Binary is also a techie term for a computer program.
BINHEX: A method of encoding files from 8-bit to 7-bit format. Preserves original file attributes.
CGI: Common Gateway Interface. A standard interface between a Web server and a Web browser. A program that handles a request forinformation and returns information or performs a search.
DOMAIN NAME SERVER: A computer that keeps track of domain addresses on that system and routes requests to specific addresses.
DOMAIN NAME: A textual name for an IP address based on the domain name system.
HOTJAVA: Dynamic Web browser developed by Sun Microsystems, Inc. that uses Sun's Java programming language. HotJava can execute "applets" or programs written in Java that can be included in HTML documents.
HQX: A program for the Macintosh used to convert binary files to 7-bit BinHex text file format.
HTML: HyperText Markup Language: a set of commands used to mark up documents with standard elements so they can be displayed and read on the World Wide Web by different browsers on different computers. A subset of SGML, Standard Generalized Markup Language.
HTTP: HyperText Transport Protocol, the protocol used by Web servers to communicate with Web clients.
HYPERLINK: Also called an anchor. A link in an HTML document, usually distinguished by underlined or highlighted text that, when selected, takes the user to another file or Web page. The hypertext link is added to the document by using the HTML tag.
IP: Internet Protocol: The set of standards by which information is transmitted on the Internet.
JAVA: Developed by Sun Microsystems, Java is a high performance, cross platform, object oriented programming language that can distribute dynamic content over the Internet. While Java is still in its preliminary stages of development, it is believed to become the future language of not only the Internet, but of computers in general.
LAN: Local Area Network, a LAN is contained within one or more buildings, as opposed to a WAN, which newtworks several locations.
PDF: Page Description Format in which documents created with Adobe Acrobat portable document software are presented. Acrobat documents end with the suffix.PDI
POSTSCRIPT: A page description/programming language developed by Adobe Systems Inc. It describes a page in a way that is device independent, so that the quality of the output depends on the resolution of the device on which it is printed.
PPP: Point to Point Protocol; allows a computer to make a TCP/IP connection to the Internet. PPP is gaining popularity and seems to be replacing SLIP connections.
PROTOCOL: A specific method of communication or "conversation" for exchanging information on the Internet. SMTP, FTP, HTTP, and NNTP are all protocols.
QUICKTIME: A method developed by Apple Computer for storing movie and audio files in digital format.
TCP/IP: Transmission Control Protocol/Internet Protocol, a packet-based communication protocol that forms the foundation of the Internet.
TELNET: The program used to login from one Internet site to another.
UNIX: A multiuser/multitasking operating system developed by AT&T and written in the C programming language (also developed by
URL: Uniform Resource Locator. A standard address for a file or location on the Internet. URLs always begin with an Internet protocol (FTP, gopher, HTTP), an Internet host name, folders, and the destination file or object.
WAN: Wide Area Network. A communications system that spans great distances, as opposed to a LAN.