WRITING & TYPOGRAPHY
CLASS 1 LECTURE
“Content precedes design. Design in the absence of content is not design, it’s decoration.” Jeffrey Zeldman
Plopping in content as an afterthought yields to the Standard Content Design Model (SCDM) or blog format of one, long, vertical column
Form over function is backwards
Even the best copywriting is for nothing if users don’t read the text
Content must survive a cost-benefit analysis: ■ Cost = time and hassle users must expend ■ Benefit = what do I get out of it?
Users only read 20-30% of words ■ Krug “scan, muddle, satisfice”
Grab users’ attention quickly. Get them interested before they decide to leave
Users are impatient. Make content as clear as possible ie; scannable and skimmable
Focus on Re Readability, Le Legibility, and Cl Clarity an and Comprehension
Re Readability: ■ Understanding the content ■ How desirable is the content? ■ Interesting enough to read? ■ Follow storytelling format = people remember stories 22x more often than facts alone ■ Use plain spoken words
Test with users of varying ages and visual capabilities using software/readability calculators
Le Legibility: ■ Proper visual perception and scanning of text ■ Minimalism – users scan and selectively choose words and sentences that interest them ■ Line breaks, shorter paragraphs, “chunking”, bullet points ■ Users cherry pick ideas and concepts
Lowest level consideration in content usability. Test by observing users, do they lean in to read/hard to see? How many words per minute do they read?
Cl Clarity and Co Comprehension: ■ Incorporate white space, focus and guide users’ eyes ■ Use of CRAP = Contrast, Repetition, Alignment and Proximity ■ Brevity ■ Information architecture ■ Inverted pyramid writing style = start with conclusion ■ Supplement text with images, charts, graphs ■ Visual hierarchy
Test how well users interpret information/perform specified task(s)
Good information architecture and good layout are important to get users to read content but to convert users from scanners to readers you need high-quality writing
Goals of good writing for web: ■ Write for how users read on web – clear headlines, scannable layout ■ Focus on information of interest to users, not on things you want to promote ■ Communicate immediately at top of page content which is interesting and useful ■ Clear navigation allowing users to get relevant information easily and quickly ■ Layout guides users’ eyes to relevant parts of page
WORKSHOP ■ Work in groups to design usability test of improved web writing for Lingscars.com ■ Following example from Jakob Nielsen’s “How Users Read on the Web,” select portion of text from Lingscars.com and create four or five variations of the same information ■ Poll random users and compile results for discussion during next class ■ Draft summary of results and observations
CLASS 2 LECTURE
“Typography is the detail and the presentation of a story. It represents the voice of an atmosphere, or historical setting of some kind. It can do a lot of things.” Cyrus Highsmith
Typography – the art of arranging type
Typography is body language; it enhances the character of the site and adds a tone of voice that subliminally reinforces what the words say to influence how those words are perceived
Good typography = good navigation tool to guide users’ eyes
Essential in context of usability and user experience
Video – History of Typography https://www.youtube.com/watch?v=wOgIkx AfJsk
Design for legibility and readability – font, size, spacing and line length readers will see and understand
Poor readability scares readers away from the content
TY TYPOGRAPHY TIPS:
• Keep number of fonts used at a minimum
• Use standard fonts
• Limit line length
• Choose a typeface that works well in various s i z e s
• Use fonts with distinguishable letters
• AVOID ALL CAPS
• Don’t minimize spacing between lines
• Use sufficient color contrast
• Avoid using red or green text
• Avoid using blinking text
Video – Typography Basics Parts 1 and 2 https://www.youtube.com/watch?v=rF0zvSr F438 https://www.youtube.com/watch?v=ZnyNGa xFRqQ
Typography exists to honor content
Primary goal of effective typography: ■ For users to easily and quickly read and understand text
ASSESSMENT ■ The One-Minute Paper. In 1 or 2 sentences answer the following questions: “What was the most important thing you learned during this section of the course re: Writing and Typography?” “What question(s) still remain and/or what are you still confused about?” ■ Turn in responses before leaving class.
Recommend
More recommend