test:  

site alert! This is only a test. Test Link.

Skip to Content

Search: {{$root.lsaSearchQuery.q}}, Page {{$root.page}}

Title Component

Hi! I'm a Title in H2. All settings have been left on default

H3 Title qwerty uiop

h4 h4 rah rah h4

H5 TITLE hello kitty
h6 is the smallest available

You can change the font color, add padding, and opt for "position in center"

You can change the default font. For example this is H2 with "Font family' set to "Sans (Gotham)"

Here is H3 with Font family set to Sans. Also, if you like the Pull Quote for headings, bad news: you cannot give the title a background color and white text 🙁

H4 with Font family set to serif

H5 with Font family set to serif
H6 with Font family set to serif

 it gives it a heading which creates semantic html for both accessibility and SEO

How is a Title different from a Pull-Quote?

  1. Difference between the components visually and how-they-work-ically (what is the right word for this)
    Title is for headings and should be used accordingly. It retains a white background unless it is used in an LSA container with an image or color in it (verify). You can change its font weights and colors as seen above. A title may contain text that isn't in the article because screen readers will read the text in a title. Titles are also crucial to search engine optimization (SEO) because the title compoment provides a heading which creates semantic html for both accessibility and SEO.
    Pull-Quote can change its own background, and has multiple font weights, styles, and colors. It can also have quotes added in the settings. A pull-quote is designed to duplicate text that is in the article, so it possesses code that tells a screen reader to skip over it, so it doesn't read the same text twice.
  2. Difference between purpose and usage
    A title is what we should be using for headings, whether we need a heading at the top of a page or to break apart a long article. 
    A pull-quote is used in graphic design. It is intended to highlight text in an article, to draw a reader in. It duplicates or closely paraphrases - pulls - text from the article and is rendered using larger type, occurs within a set space either within or offset from the article


    From Wikipedia, the free encyclopedia
  1. In this example, a pull quote is centered between two columns. The text has been "pulled" from the bottom of the first column.In graphic design, a pull quote (also known as a lift-out pull quote) is a key phrase, quotation, or excerpt that has been pulled from an article and used as a page layout graphic element, serving to entice readers into the article or to highlight a key topic. It is typically placed in a larger or distinctive typeface and on the same page. Pull quotes are often used in magazine and newspaper articles, annual reports, and brochures, as well as on the web. They can add visual interest to text-heavy pages with few images or illustrations.[1]
  1. Placement of a pull quote on a page may be defined in a publication's or website's style guide. Such a typographic device may or may not be aligned with a column on the page. Some designers, for example, choose not to align the quote. In that case, the quotation cuts into two or more columns, as in the example shown. Because the pull quote invites the reader to read about the highlighted material, the pull quote should appear before the text it cites and, generally, fairly close to it.[2]
  1. Pull quotes need not be a verbatim copy of the text being quoted; depending on a publication's house style, pull quotes may be abbreviated for space or paraphrased for clarity, with or without indication.[2]
  1. A disadvantage of pull quotes as a design element is that they can disrupt the reading process of readers invested in reading the text sequentially by drawing attention to ghost fragments out of context. At the other extreme, when pull quotes are used to break up what would otherwise be a formless wall of text, they can serve as visual landmarks to help the reader maintain a sense of sequence and place.

from yale

Design large, visually distinct headings and subheadings to help users find their way. Generally, the title of the page should be the largest heading. Other headings and subheadings should have less visual weight according to their importance. Likewise, reserve more saturated, attention-grabbing colors for more important areas of the page.