Wheaton College Norton, Massachusetts
Wheaton College
Web

Window shades

Posted on September 6, 2011

If you edit web pages, you might want to be able to roll up chunks of your page's copy. "Window shades" can make pages easier to scan, while keeping the details just a click away.

This technique works very well for Frequently Asked Questions (FAQ). Career Services demonstrates this well on their FAQ page for Davis International Fellows. Note the questions are links: click once and its answer appears; click again and the answer disappears.

Here's how...

Your site might have a page that would benefit from "window shading"; if so, here's how to create a simple FAQ:

  1. Launch your browser (remember not to use Internet Explorer) and head to your page.
  2. Sign into your editing account and go "behind-the-scenes"; you'll add content to the page body via your editor's "Visual" tab.
  3. Type a question followed by a hard return; then type an answer followed by a hard return.
  4. Do this a coupe more times. Two or three questions and answers will give you something to work with.

For each question:

  1. Highlight the question.
  2. Mark it as a heading. For example, selecting "Heading 5" from the "Format" drop menu will give your nice-looking questions that are normal size and bold.
  3. Style it as 'windowshade' by selecting "Windowshade" from the "Styles" drop menu.

Don't forget to save your work by clicking the blue "Update" button, and preview the page. That's all there is to it. Each answer should roll up underneath its question.

Enjoy and, as always, let us know if you have questions.

Comments are closed.

css.php