{"id":105,"date":"2022-07-26T14:07:28","date_gmt":"2022-07-26T18:07:28","guid":{"rendered":"http:\/\/wpdocs.bu.edu\/bu-stories\/?page_id=105"},"modified":"2022-07-27T13:02:43","modified_gmt":"2022-07-27T17:02:43","slug":"text","status":"publish","type":"page","link":"https:\/\/wpdocs.bu.edu\/bu-stories\/best-practices\/text\/","title":{"rendered":"Text"},"content":{"rendered":"\n

Stories support two types of text: heading and copy text. Regardless of which you use, text should always be easy to read. Make headings as large and legible as possible while keeping text short. Copy should be smaller but still readable, typically a font size between 24-36. Ensure the text color has enough contrast with the background image or color.<\/p>\n\n\n\n

\n
\n

DO<\/strong><\/p>\n\n\n\n

\"\"
High contrast between background and text makes the words easy to read. <\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n\n\n\n

\n

DON’T<\/strong><\/p>\n\n\n\n

\"\"
Without proper contrast, the text and images blend together, making the words hard to read and the story difficult to follow.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n<\/div>\n\n\n\n

If there isn’t enough contrast, try lowering the opacity of background images and adding a dark background, or adding drop shadow or background color to text.<\/p>\n\n\n\n

\n
\n

DO<\/strong><\/p>\n\n\n\n

\"\"
Be mindful of page composition when placing text, and try to create a balance between photo focal area and the text.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n\n\n\n

\n

DON’T<\/strong><\/p>\n\n\n\n

\"\"
Placing text too close to the bounds of the page can impact the experience, especially on mobile. It also looks imbalanced.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

DO<\/strong><\/p>\n\n\n\n

\"\"
Applying a text highlight or background makes the words pop, or grab more attention.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n\n\n\n

\n

DON’T<\/strong><\/p>\n\n\n\n

\"\"
Placing text on top of a visually busy image makes reading the words difficult.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n<\/div>\n\n\n\n

Keep it Concise<\/h2>\n\n\n\n

Text should be short and to the point. Aim for 200 characters or less per page.<\/p>\n\n\n\n

\n
\n

DO<\/strong><\/p>\n\n\n\n

\"\"
Keep text short and snappy. Varying type size and style to break up blocks of text can make it easier to scan.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n\n\n\n

\n

DON’T<\/strong><\/p>\n\n\n\n

\"\"
A big wall of text is difficult to read in this medium and discourages engagement.<\/figcaption><\/figure>\n\n\n\n

<\/p>\n<\/div>\n<\/div>\n\n\n\n

Some pages might need more than a sentence, but try to limit the amount of those pages with longer amounts of text. Look for opportunities to split text across pages, or further streamline and simplify.<\/p>\n","protected":false},"excerpt":{"rendered":"

Stories support two types of text: heading and copy text. Regardless of which you use, text should always be easy to read. Make headings as large and legible as possible while keeping text short. Copy should be smaller but still readable, typically a font size between 24-36. Ensure the text color has enough contrast with […]<\/p>\n","protected":false},"author":3324,"featured_media":0,"parent":95,"menu_order":4,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/pages\/105"}],"collection":[{"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/users\/3324"}],"replies":[{"embeddable":true,"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/comments?post=105"}],"version-history":[{"count":18,"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/pages\/105\/revisions"}],"predecessor-version":[{"id":229,"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/pages\/105\/revisions\/229"}],"up":[{"embeddable":true,"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/pages\/95"}],"wp:attachment":[{"href":"https:\/\/wpdocs.bu.edu\/bu-stories\/wp-json\/wp\/v2\/media?parent=105"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}