Here is a demo web page - these hints are geared toward using Nvu -  start by selecting edit page from the file menu heading.

This page has examples of:
Targets within a page
Linking local pages
Linking www sites
Using tables to help format text 
Inserting Figures and Crediting them
Making Interactive and Animated windows

Background images and page titles
References
 

Targets within a page
From the menu above this section was selected as a target.  Edit file and take a look at how its done.  In composer you put cursor where you want the target, then go to insert menu above and insert target.  I gave this one the name "target within  page".
 
 

Linking to other pages locally
An example of a local link would be the course web page (http://www.udel.edu/chem/bahnson/chem645/index.html).  This link could be made in composer by highlighting a group of words, for example Chem 645 and then going to link.
This could be done the same by putting in only index.html, as long as the page with link (this one) sits in the same directory.  This is how you would setup your site if you want to have several html files, instead of one big one.  You would have a main page (often index.html) and then link to each of your other pages.   If you do it this way its good to put links back to your home page.

Now let's make another local html file that we'll put in our folder.

Linking to www sites
An example of a www site would be, what else, the PDB
where (http://www.rcsb.org/pdb/) needs to be typed as the URL link.
 

Using tables to help format text
You can use the table button above to insert table.  This helps with text and image formatting.  See CHIME windows below for an example.  Often different browser settings can effect your formatting.  One solution is to encase text in tables with fixed width like the second example below.  An easy way to change table properties is to hold down right mouse button in composer and select table properties.
 
Here is an example of a table with one column and the width is set to 100% of the web. browser.  Resize your browser window and see what happens here.

 
Here is an example of a table with one column and the width is set to 600 pixels.  Resize your browser window and see what happens here.

Inserting Figures and Crediting Them
Figure insert a table with one cell

them insert figure, resize, put ref. below, and link the reference here.  Images should be in same folder (directory) as html file, unless the path is explicity shown.

 

Making Animations and Interactive Windows

Download CHIME and compatible internet browser - with explanation
UMASS site for RasMol, Chime and Protein Explorer - very good site

Jmol is like chime, and is a lot more flexible with modern web browsers.  It is a little tricky to setup.

http://www.pdb.org/pdb/static.do?p=explorer/viewers/jmol.jsp

VMD is another free graphics program - could use to make your own animated rotations
 

Background images and page titles
If you want to put a background image on your web pages, hold down right mouse button in composer editting mode in a section that isn't a table and select page properties.  Try this with the image that is on the course web page by selecting colors and backgrounds and inserting "UDel_bkg2.jpg".  This menu is where you would give a title to each html page you make.  This is a good idea since the title is what comes up on the very top of your browser.

References
Find your refs on pubmed for example and link to the pubmed page.
 

Have Fun !


     Back to the Chem 645 Home page

Back to the Chemistry Home Page