CSU Extension Webpage Template
Session 6
March 2010
A
page inside a
folder inside the
root folder
 Literally the 2nd
level of the
directory
structure
 Index.shtml is a 1st
level page
 Agri.shtml is a 2nd
level page
Home page (index.html)
About Us
Contact Us
1st level pages with little upkeep
4H
Agriculture
Family/Consumer
Horticulture
Master Gardener
2nd level pages requiring own folders
3
 Each
topic folder (e.g. agri) has a page
already inside (e.g. agri.shtml)
 To create a new page, copy an existing
second level page
 Code is different on a second level page
than a first level page

Six lines of code are different on a second level page:
• ../ is added to beginning of the “path”
• “Backs up” a folder to root folder

Images:
• <img src=“../images/header.jpg" width="804" height="130"
usemap="#Map" />

SSI:
• <!--#include virtual="../_ssi_topnav.html" -->
• <!--#include virtual="../_ssi_leftnav.html" -->
• <!--#include virtual="../_ssi_footer.html" -->

CSS:
• <link rel="stylesheet" href="../css/general.css"
media="screen" type="text/css" />
• <link rel="stylesheet" href="../css/print.css" media="print"
type="text/css" />
 Less concerned with micro-content
• They’re here already
• Primary purpose: present information
 Create from scratch: text, images, links
 Pre-existing
• PDFs
• Word
• PowerPoint
• Excel
• Tabular data
documents
 Just
link to it
 PDF will open in a browser window
 Doesn’t require the end-user to buy
anything!
 Another option: convert PDF to HTML
• Need Adobe Acrobat
• Save As type > .html
• Save directly into root folder
• Creates an images folder
 Easiest
to cut and paste into existing
page
 Also Save As Type > .html
• Save directly into the root folder
• Creates a folder for supporting files
 Word
code is SO bad, there’s a command
for it
 Commands>Clean Up Word HTML
 Don’t
convert it to .html
• Doesn’t play well with Firefox (50% of your
audience)
• Huge file sizes
 Best
options:
• Have end-user download (requires them to have
PowerPoint)
• Use Slideshare or Google docs to embed a
slideshow (for Google docs, must be .ppt, not
.pptx)
 Works
well
• Supports multiple worksheets
 Save
As Type > .html
• Save directly into the root folder
• Creates a folder for supporting files
 Can
import Excel directly into a page
 In Excel
• Save As Type > .txt (tab delimited)
 In
Dreamweaver
• Insert>Table Objects>Import Tabular data
• Set cell padding, spacing, border, header formatting

Cleanup:
• Select rows and columns by clicking just next to
them, then hit delete
• Select multiple cells and use the “merge” icon to
merge them