|
FREC
480 -- publishing GIS projects as web pages Your FREC480 projects are to be published as web pages
suitable for presentation. For details on how to write web pages,
check out Mad Dog's
site or another HTML how-to on the web. I want you to write at
least your first couple of projects
in raw
HTML with Notepad and/or Pico to get the hang of it. Once you get
familiar with the basic coding process, you can switch an HTML editor
such as Netscape Composer. These editors don't always format your
pages exactly the way you want, but if you have familiarized yourself
with HTML, you will have the skills to tweak the code to get exactly
what you want. The server for your web pages will be UD's "copland" UNIX
server. Use SSH Secure Shell to log into copland.udel.edu using
your UD mail login and password. You will have to familiarize
yourself with some basic UNIX commands
and concepts in order to create your own website. I have also
created a quick-and-dirty UNIX cheat
sheet for later reference. This directory must be readable and executable for everyone. Type ls -l at the UNIX prompt to get a detailed directory listing with r, w and x "permissions" shown in the left column. The permissions for your "public_html" directory--and every file or subdirectory you include in it later on--should look like drwxr-xr-x or -rwxr-xr-x. If they don't, use the chmod (change mode) command chmod 755 public_html to set the appropriate permissions. Now switch into that directory: cd public_html The UNIX Pico text editor is very similar to the Pine email program--simple but doesn't support a mouse. Basic commands are listed along the bottom of the screen. Use Pico to start writing a test page: pico mypage.html You should see the blank Pico screen with some basic commands on the bottom. Type these HTML tags and some test message like this: <HTML>Ctrl-O and Enter to save this file as mypage.html, then Ctrl-X to exit Pico. Now change the file's permissions so it's readable to a web browser: chmod 755 mypage.html Now try to access it with a web browser. The URL will be http://udel.edu/~yourlogin/mypage.html substituting your own login for yourlogin; don't forget the ~ character. Note that you don't include public_html in the URL path. If you have done everything correctly, you should see the single-line message to your mom: "Hi Mom, here's my first web page!" That's all it takes to create a web page--a plain text editor and some knowledge of HTML format tags. Basic format tags, images, links and other tricks are explained and demonstrated on Mad Dog's website. If you prefer, you can write your webpage on your local machine using Notepad (which supports a mouse), and then transfer the file via FTP to your public_html directory. You can do basic file management within FTP; for example, to set the UNIX permissions on a newly-transferred file simply right-click on its filename and edit its properties. Do not use MS-Word or WordPad to write your web pages. If you write web pages with MS-Word, saving the document as "Web Page," your files will bloated with horrible code and almost impossible to edit. WordPad files won't work at all because they have weird characters embedded. Basic protocols Every web page file name should end with name extension .html. Filenames should be in lower-case characters only, and should not include space characters or other special characters (but you can use the underscore _ character in lieu of the space character). To be accessible to a browser, all of your HTML files must be placed in your public_html subdirectory, or a subdirectory of that. For security reasons, browsers are not allowed to access your home directory or other contents of it. If you get a "Permission denied" or "Forbidden" message when trying to access your web page, your need to set appropriate permissions. Your web directories, HTML files and associated images must be readable by everyone, and directories have to executable by everyone too (chmod 755 dirname); just be careful not to give write permission for your files or directories to anyone but yourself. Use the chmod command with the "*" wildcard character to set blanket permissions for all files and sub-directories in a directory: chmod 755 * How you organize your coursework files within public_html is your business, but life will be much easier if you use informative filenames and put your projects in separate subfolders like proj1 and proj2 for each project.
The home page for each directory should be named "index.html."
The client browser will load this page by default when it accesses
that directory; otherwise the client will get a
listing of all the stuff in your directory and be able to
rummage through everything.
So the directory tree for your public_html directory would look something like this:
/home/usra/64/25640: (your home directory on the server)
| other.stuff, from.other, classes, ...
|
public_html: (your home directory for the client browser)
| index.html,
| myphoto.jpg, mydoggie.jpg, ...
|
--------------------------------
| |
proj1: proj2: ...
index.html index.html
proj1map1.gif,.. proj2map1.gif,...
Your webpages will be more portable if their image tags and local links reference images and other files by relative path, e.g., <IMG SRC="map2.gif"> simply references map2.gif in the same directory. You can move the webpage file and its associated image together to another directory and the webpage will still display the image. But if your webpage's image tags have absolute paths like <IMG SRC="~fubar/proj2/map2.gif"> the server will not be able to find the image if it is moved elsewhere. Check how your page displays in various browsers--Internet Explorer, Firefox--and how it looks when you resize the browser window. Your map images should be saved as GIF or PNG files. These formats avoids the fuzzing that JPEG image compression can cause. Before using File--Export Map in ArcMap to save a map image file, you should shape the map frame and zoom so there isn't excess white space. While exporting, adjust the pixel resolution so you get an appropriately-sized image. When you resize images after they're created, either with an image editor or simply by specifying enlarged width and height values in the <IMG> tags, they don't often look very good. Your web pages will look better if your maps have a consistent size and style. Maps of the same area should have the same dimensions. Maps of different areas look better displayed side by side if they have the same pixel height. You can maintain good control of your webpage layouts by placing maps and associated text in HTML tables. |