Initial Content Creation

When you create content for your site, you'll likely be on a "staging" site with a basic wireframe theme. The visual design comes later, and is directly influenced by your work because its purpose is to display the content you create. So, the appearance of the site is going to change based on what you do while creating the initial site content.

You have two goals

1. Create and Mark Up Page Content

"Mark up" is done with the WYSIWYG editor. You define the content and how it's organized. You indicate something is a headline, or bulleted list, or paragraph. Later, the graphic designer decides how to display those items.

2. Organize Pages Hierarchically

Think of your site like a book with chapters. Pages at the top tier are sections of the site. Sections can have sub-pages. The way you group your pages is the site outline, or Site Structure. Your site navigation is built from this.

You have things to do

Please do these, as they will make the entire process easier & faster.

Mark headers as headers

When you have a word or phrase that’s going to act as a header (like "You have things to do"!), select the Format menu in the WYSIWYG & choose an appropriate header (see the sidebar for more info). However, do not use bold & do not change the font size (that will be part of the design).

You have things to avoid

Please do not do these, unless you want to add time, complexity, & extra work to your project!

Don't try to be a page designer

Just create the content and mark it up, using bold & italics as needed. The "real" designer will determine how everything else looks. That means you should not mess with lots of things, including:

  • colors
  • fonts
  • sizes
  • alignment

Don't worry about images too much

Go ahead and include images on pages as appropriate, but don't worry about aligning or sizing them. We'll get into styling and laying out page content later.

Avoid pasting pre-styled content

When you copy from a webpage, or Mirosoft Word, you get both the content and underlying code that carries with it styling that can really cause a problem. Use the Paste as Plain Text feature in the WYSIWYG to insert clean content.


Under the Format menu in the WYSIWYG, choices range from Heading 2 to Heading 6.

  • Heading 2 is the largest; Heading 6 is the smallest (Header 1 isn’t available because that’s always used by the title of your webpage).

  • Heading 5 and Heading 6 are almost unreadably tiny, so try to avoid using them if at all possible.

  • Don’t use a Heading 3 unless it’s located somewhere under a Heading 2; likewise, don’t use a Heading 4 unless it’s located somewhere under a Heading 3. You can use as many Heading 3s as you’d like on a page, but they should all be somewhere under Heading 2s.