UPDATED on April 18, 2018

Summary: typography determines the display of text on your page. It is an important component of your web content. Careful consideration of keywords, readabililty, and accessible formatting are important components.

The font size and style used on LCC's websites, along with pre-set formatting options such as heading sizes, bold or italicize, or blockquote, have been predetermined in a cascading 'style sheet' that manages the consistent display of all text across the website. This ensures the website delivers optimal readability, familiarity, and brand/reputation.

This page does not address how to change the font style or size of your text. It addresses the correct way to tag your text. In addition, web editors may use bold or italicize settings as appropriate.

Using correctly tagged typography creates user-friendly sections of content on your web page, optimizes the way search engines find your page, and provides accessibility to disabled individuals.

Text is tagged through the use of 'header tags'.

How to tag your text

  1. Key in your text
  2. Select it
  3. On your toolbar, click the 'Paragraph' button. Select your desired style <H2 - 6>
  4. To change the tag, select your text and select a different style. 

Rule of Thumb: Headings are used in a hierarchical manner. Anything formatted as Heading 3 should be a sub-section to what has been labeled as Heading 2. Headings are nested under other headings; you should never jump from Heading 2 to Heading 4 without using Heading 3.

Header Tag Options

Page Title Text <H1>

Warning: Do not use in body content.

Explanation: Use of <H1> title text is restricted to page title only. Title text is automatically created when you create a new section or page, and appears in the breadcrumb area, with the exception of the custom breadcrumb described above. Title text should contain keywords you think people will use when searching for your page.To modify the title see the Properties/Page Parameters: Title section.

Search engines look for <H1> tagged text first.

Section Header Text <H2>

Explanation: This text should be used to define major sections of content in the body of your page.

Search engines look for <H2> tagged text second.

Sub Section Text <H3>

Explanation: This text should be used to define sub-sections of content underneath your <H2> sections in the body of your page.

Search engines look for <H2> tagged text third.

Title Text <H4>

Explanation: This text should be used to define third-level sections of content underneath your <H2/H3> sections in the body of your page.

Search engines look for <H2> tagged text fourth.

Title Text <H5>

Not ranked by search engines.

Title Text <H6>

Not ranked by search engines.

Lead Text

Explanation: Lead text should be used for introductory sentence at top of page. Absent any H tags on other text, search engines will look at the words in this text.

To tag lead text

  1. Key in your text
  2. Select it
  3. On your toolbar, click the 'Styles' button. Select 'Lead Text'
  4. To remove lead text styling, you need to understand html, and have access to the source code.

Paragraph Text <p>

Explanation: Use for any non-tagged text on your page. By default, any text you add to your page appears as <p> tagged text.

Example: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae.

Blockquote

Use: Use for quoted material. Search engines do not look for blockquotes

Example (no cite):

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante."

Example (cited):

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante."

Someone famous in Source Title

To create Blockquote

  1. Key in your text
  2. Select it
  3. On your toolbar, click the 'Blockquote' button.
  4. To remove blockquote, select text and click the 'Blockquote' button again.