- HTML & CSS
-
Long-winded introduction to basic HTML, CSS, and SSI (server-side includes). (Needs to be re-imagined as more reference, less bloated narrative.)
- PopUp Windows
-
Demonstrates the CSS "visibility" property, and some simple javascript.
Also, a general .hidden class manages visibility, specific ID's distinguish each "window".
- DOM: Document Object Model
-
6- or 7-part light-weight overview
- DOM: About Objects, general idea of Objects created from markup
- DOM: the Tree, introduces HTML document tree
- DOM: Finding Elements, how to find elements by ID and tagname
- DOM: Using Elements, putting elements to work, w/step-by-step demo
- DOM: Creating Elements, bare intro to creating / removing elements on the fly
- DOM: Altering Elements, a glance at modifying elements in real time
May want "about Forms" and shd include link to W3schools AJAX link.
- coffee theme
In progress — still needs to solve 100% vertical length of left and right sidebars.
- x
CSS scratch pad for testing rules.
- WCenters
-
Links to the various writing centers using my sign-up code.
Newts and newts setup are on my web space and exist for development and testing.
OWRC (test) is a test site on my web space for the Odegaard Writing and Research Center.
- other sites
-
Miscellaneous other sites I've worked on. PSWP 2010, UW Writes 2008.
CSS: Demos & Tests (with some Javascript)
- HTML & CSS
Long-winded introduction to basic HTML, CSS, and SSI (server-side includes).
(Needs to be re-imagined as more reference, less bloated narrative.)
- Floats & overflow
Key concepts:
- overflow: auto
- generated content
Float's normal behavior is to overflow its parent. This page shows how to prevent widows and orphans for "cleared" elements.
- Style by Context
Selection by context can reduce HTML markup.
Key selectors:
- child
- :first-child
- grandchild
- :nth-child
- adjacent sibling
When styling text, control inheritance.
- PopUp Windows
Popup "windows" that demo CSS "visibility" property, and some simple javascript.
Also, of use, is separating the .hidden class from ID's specific to each window.
- Fade Effects
HTML, CSS, & Javascript for fade effects on menu events.
A slide-show presentation of finding & adding elements in the DOM, using loops, objects, & timers to adjust opacity.
- DOM
Key concepts:
- object
- document tree
- interface
Introduces the idea of the "object" and the "document tree". Shows how to find and use HTML objects, and how to create or edit existing objects.
The series peters out, never completing a promised overview of interacting with forms in real time. (May want "about Forms" and shd include link to W3schools AJAX pages.)
- Show / Hide demo
Not much here, but does illustrate various kinds of windows manipulated singly or in groups by ONCLICK events.
- IE6 fixed
Test of Stu Nichols' stategy for mimicking fixed-position for IE6.
- curved background
Semantically defensible markup for complex windows. Curved borders are tied to DIV with header, .body, and .footer sections.
- coffee theme
Just playing around. Several unsolved challenges.
- x
CSS scratch pad for testing concepts.
wcenters
- newts
Development site for sign-up calendar system used by various writing centers.
- newts setup
Development site's web app for managing sign-up calendar.
- owrc
Live site in use in Odegaard Undergraduate Library.
- owrc (test)
Test site in my account for use by Odegaard Writing Center staff.
- communication
Live site in use by Communication Department. Older style graphics.
- pswrite
Live site in use by Political Science/Law Society & Justing/International Studies Writing Center.
Not my graphics.
- polsadvc
Live site in use by Political Science Advising.
Not my graphics.
- anthro advising
Live site used by Anthropology Advising.
Not my graphics.
- anthro wcenter
Live site used by Anthropology Writing Center.
Not my graphics.
- wcenter (gone)
- chid (gone)
other sites
- PSWP
PSWP's new site. The Site Design page illustrates glossary entires, pop-up windows, and content replacement based on the ONLOAD javascript function.
- ENGL 494B
Course page for Laura Chrisman's ENGL 494B class. Site is one page with javascript/CSS for content replacement.
- UW Writes
Design for John Webster, the Director of The Writing Program in the College of Arts & Sciences
- English redo
Alternate version of English Home Page, centered, textured background top shadow.
- Seattle Review
Graphics design by Sayre Coombs.
All fonts are webfonts (downloaded in real-time). Liquid layout w/special attention to readerly look.
- ORCA help
Instructions adjust to selected browser.
- Regarding Coffee
My frivolous site with overview of coffee roasting setup and a few attempts at latte art.