This section covers topics on basic web site development, including information on editing, using the UMD templates, and uploading your files to the UMD web server.
There are a variety of options available for creating and editing your web pages. Dreaweaver is a popular package (available for both Windows and Mac computers) that many people on campus use to create, edit and manage their web sites. It includes a file transfer option that makes it easy to work with the files on your desktop, then transfer them to the web server.
Another option for Windows users is to set up a Samba "MyWeb" directory. The MyWeb directory allows users to edit files in their personal web directory using any PC-based editor (Dreamweaver, Word, Notepad) This means you can edit your personal web pages in real-time, without bothering about uploading and downloading via sftp and making file permission changes.
Templates allow users to easily create a series of web pages with a similar format. Templates and style sheets with the standard UMD design are available for all departments to use. These templates incorporate the current University web design standards. Using the templates will ensure that your web site meets University requirements.
Additionally, because the UMD templates use virtual includes, if the standards change your web pages will be automatically updated.
Virtual includes are another way to provide consistency within a series of pages, as well as make it easier to update the pages. A virtual include is a reference to another html file that is to be "included" when the page is viewed with a browser.
An example of the HTML code for a virtual include is:
The referenced file ("footer.html") contains the following code:
<hr>
The University of Minnesota Duluth is an equal
opportunity educator and employer
<br>
©2003 University of Minnesota Duluth
<br>
Page URL http://<!--#echo var="server_name"-->
<!--#echo var="document_URI"-->
By changing the referenced HTML file, all pages with the virtual include are automatically updated.
In the UMD templates, both the header and the footer are set up as virtual includes. This way, if we want to change the information in the footer on each of the UMD pages, we simply change one file (footer.html) and all of the main UMD web pages are automatically updated. All of our ITSS web pages include an additional virtual include for our ITSS header and footer.
The University's Google search engine is capable of searching all of the UMD web pages. You can also search for pages in only a specified directory (such as a department web site) if you wish. This is nice since it will return links that are usually more relevant than a page from another department.
These sample forms will help you set up the search form on your web pages.
You can increase the chances of your page being "found" by the UMD HTTDig search engine by including one or more "keywords" in the head of your web page.
For example, the keywords for this page are "keyword" and "search". This page would show up in the list for anyone who used the UMD search engine to search for "keyword" or "search".
If you have a page on the UMD web server, you can specify keywords by including the following line between the <head> and </head> tags:
<meta name="keywords" lang="en-us" content="word1, word2, word3">
Replace "word1", "word2", etc. with the keywords for your page. You can include as many keywords as you like, separated by a comma.
Symbolic links are handy for some special situations. They can be nice since the person browsing your site will not know that where they think a file is, and where it actually is, are two different places. A symbolic link should not be confused with an HTML link, they are completely different. You could think of them more as a pointer or a Shortcut (Windows) or an Alias (Macintosh).
If you want to see a symbolic link in action, follow this link and then try to notice a difference other than the URL. There is no difference because the symbolic_link.html is actually a symbolic link that points to this file symbolic.html. To do this, I had to follow these steps.
The UNIX command is ln which means link. The -s tells the link command that link to be made is symbolic. You will notice in the example above that the file to be "linked" to is listed first, then the name of the "link" is listed.
Many people find it easiest to develop their web pages on a personal computer using a text editor or one of the many web page editor programs now available (such as Dreamweaver). Once your files are ready to go, you'll need to transfer them to the web server and set the correct permissions so the rest of the world can view them.
Many web development programs (including Dreamweaver) have a built-in file transfer process. If the program you use does not include file transfer capability, you will need to use another secure file transfer protocol (sftp) program, such as Fetch (for Macintosh computers) or WinSCP (for Windows users).
If you connect to the Internet through a non-UMD ISP (cable modem, DSL, or other), you will need to install and run the VPN client software before you can transfer files to the UMD web server.
You will need the following secure file transfer protocol (sftp) settings to upload your files to the UMD web server.
| Type of Account | Settings |
|---|---|
| Department (e.g., http://www.d.umn.edu/itss/) |
|
| Personal (e.g., http://www.d.umn.edu/~breeves/) |
|
Here is an example of how to configure Filezilla (Windows) for SFTP:
Here are examples of how to configure several versions of Dreamweaver for SFTP:
For detailed instructions, see: Using SFTP in Dreamweaver CS5.
Rev: 11.9.11 sab
University of Minnesota Campuses