Website Text Styles (H5)

(H1) This heading H1 is the main headline for the page – it has the most SEO impact of all headlines

The H1 tag can often be used as lead-in text on a page, but should only be used in cases where it makes good semantic sense to do so. It shouldn’t be used purely for decorative purposes; instead, use it when you need to emphasize both the visual and semantic meaning of the text.

(H2) Headings can be used to break up main sections of the page

The Heading 2 has a high SEO value. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sollicitudin, magna eu vestibulum venenatis, dolor turpis iaculis mauris, ac pellentesque metus nisi nec lectus. Fusce vel augue ipsum. Mauris ipsum mi, dictum sed mollis non, scelerisque nec leo. Duis aliquam enim in tortor interdum eleifend. Nulla facilisi. Proin sollicitudin congue eleifend. Quisque at erat vitae orci imperdiet mollis. Morbi imperdiet justo eget nibh consectetur in dictum nulla egestas. Ut at ullamcorper dolor. Integer ligula nisl, pulvinar vel dapibus nec, viverra ac elit.

(H3) This lead-in/call-out paragraph is heading 3 text. any characters highlighted and marked as bold will appear darker and slightly larger, like the first sentence. the rest of this paragraph is not bold and appears lighter and slightly smaller. the use of this h3 increases the paragraph’s seo value. quisque at erat vitae orci imperdiet mollis. morbi imperdiet justo eget nibh consectetur in dictum nulla egestas. ut at ullamcorper dolor. integer ligula nisl, pulvinar vel dapibus nec, viverra ac elit. remember the heading h1 should be reserved for the most important verbiage on the page, for seo (search engine optimization) purposes.

(h4) headings are smaller in emphasis and priority

The Heading 4 give you another opportunity differentiate the text from the body paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sollicitudin, magna eu vestibulum venenatis, dolor turpis iaculis mauris, ac pellentesque metus nisi nec lectus. Fusce vel augue ipsum. Mauris ipsum mi, dictum sed mollis non, scelerisque nec leo. Duis aliquam enim in tortor interdum eleifend. Nulla facilisi. Proin sollicitudin congue eleifend. Quisque at erat vitae orci imperdiet mollis. Morbi imperdiet justo eget nibh consectetur in dictum nulla egestas. Ut at ullamcorper dolor. Integer ligula nisl, pulvinar vel dapibus nec, viverra ac elit.

(h5) headings are minor headlines

Your website assumes that H5 tags will be used as the main title text of any given page. This is because visitors need the visual feedback of the page they’re viewing (hence the larger font size), but generally speaking, page titles aren’t full of very search engine friendly text — Google won’t place a lot of value on a phrase that says “About Us.”

Here is paragraph text to better mimic actual content as it will appear on your page sometimes with emphasis and other times bold. Sometimes your content will be linked to another page (this link is a dummy and only displays the style visitors will see with links on the page). This next paragraph of latin will help display line-height and the margin between paragraph text.

Aenean et lorem justo, eu cursus nisi. Aenean tristique vulputate tempus. Pellentesque euismod ullamcorper metus vitae dictum. Nullam sit amet consectetur magna. Quisque et lectus et ante convallis vehicula. Integer eu leo ac lacus imperdiet aliquet. Maecenas mollis quam enim, mattis pulvinar metus.

The following unordered list has only lead-in text and no headline preceding it.

  • Aliquam vel faucibus dui
  • Proin quis mi mi
  • Etiam libero sapien, faucibus vitae semper
  • Nunc ultrices lectus ac mauris
(H6) This is a heading H6. An ordered list follows.
  1. Aliquam vel faucibus dui
  2. Proin quis mi mi
  3. Etiam libero sapien, faucibus vitae semper
  4. Nunc ultrices lectus ac mauris

Notice the headline and paragraph text are in proximity to the list items. No extra spacing is required and in fact, adding breaks will separate the list from its lead-in text or headline — the proximity is necessary display their relationship.

Here is an accordion:

+This is an accordion Button

This will be where the accordion text goes.  It can be anything ranging from image to ordered/unordered lists.

  • This list
  • is inside
  • the accordion

Here is a simple table

Table Heading (Column One) TABLE HEADING (Column Two)
Cell Data One – Note table headers have no case enforcement; you type upper- and lowercase as you prefer. Cell Data Two – Note the table header was typed in ALL CAPS
Cell Data Three Cell Data Four

This footnote has a class of “.footnote”. Note that an asterisk (*) will automatically get prepended. This second lines shows the line height difference