Creating your first webpage

These instructions are meant for students, faculty and staff using accounts on MSU CSE instructional systems. The procedures described below may not correspond to the procedure for adding your own page at other locations.

What is HTML?

Files ending in the extensions .htm and .html are HyperText Markup Language files. HTML is the markup language you use to specify the contents of a web page. Many HTML primers are available on the web:

  • The Bare Bones Guide to HTML
  • A Beginner's Guide to HTML
  • Composing Good HTML

One way to learn HTML is to surf the web and look at the source for interesting pages (browsers have a menu option for this, usually on a View menu). Many pages now are created by a composer or word processor, and may be very difficult to understand, containing a great deal of embedded extraneous material. You'll have to look for pages that were coded by hand.

How to create your own home page:

Everyone with an account on the CSE instructional systems is able to create their own home page. Your home page is not limited in any way. You are free to make references to other pages, pictures, sound, movies, etc. (However, you may not have paid advertising on, or operate a business from, your CSE home page!) Following are directions for setting up your home page. If you have questions or comments please email support@egr.msu.edu, giving us enough information to answer your question.

First, create a directory in your home directory named web (e.g., mkdir ~/web). This directory must be called web. This directory is where you store all of your documents, pictures, etc.

Second, make your web directory world readable (e.g., chmod 755 ~/web). If you do not make the directory world readable, no one can see any of your documents.

Third, create a file called index.html in ~/web that contains your home page. This file is your main or top page. If you want to add other pages later you make references to them inside of index.html. (You may want to learn about making your index.html first.)

Fourth, make index.html world readable (e.g., chmod 644 ~/web/index.html).

Finally, your home directory must be world accessible (e.g., chmod 711 ~).

Testing your index.html

You are now ready to try out your page. To test it simply start a web browser and, under the File menu, select Open. When the dialog box comes up type in the URL of your home page:

Where <username> is your login name, for example:

If you experience errors, edit your index.html, fix the problems, and reload your page.

One of the most common errors is that you won't see anything at all! Missing end tags such as </table> often result in an entire section simply not being displayed. If you want help debugging your page, look at the validation software on the W3C site. Enter the URL of your home page (as explained just above) and check the box to get the weblint results.

To Limit the current directory and below to only CSE accounts.

Create a .htaccess file in the directory to be protected and enter the following information:

AuthType Basic
AuthBasicProvider ldap
AuthName "Roaming Access"
AuthLDAPURL ldap://ds.cse.msu.edu:389/ou=People,dc=cse,dc=msu,dc=edu?uid?sub
AuthLDAPGroupAttribute memberUid
AuthLDAPGroupAttributeIsDN off
Require valid-user

To require a specific user change the line

Require Valid-user 
TO
require user {CSEuserid}

Ensure the permissions on the .htaccess file are correct (chmod 755 ~/web/.htaccess).

Create independent id:password file for access to a directory. 

Create a .htaccess file:

AuthType basic
AuthName "Only by invitation"
AuthUserFile /user/YOURCSEID/web/DIR/.htpasswd
Require valid-user

Create the .htpassword file:

NOTE:  only use -c the first time to create the file.
htpasswd -c  /user/YOURCSEID/web/DIR/.htpasswdID

For information on limiting access to a class or group please email the System Managers.

We've just scratched the surface of what you can do with a web page. The web has become as complex as any other part of computing, and is fast becoming the commercial raison d'être for computing. Have fun!

  • View a simple .html template
  • Getting started using CGI routines
  • For further information