Writing Content that Works Everywhere edUi

Writing Content
that Works
Everywhere
(including iPhones)

Rachel DeLauder
NewCity
Tuesday, November 5, 13

About
NewCity


Responsive
Design


- Why responsive vs. mobile site?
* Search engines give preference to responsive sites in rankings
* Avoids duplicate content to update and maintain
* Having reduced/limited content for a separate mobile site can be bad for usability

Why Reformat Content for Mobile?


- More engaging for users
- Clean out unnecessary content on your site to reduce the amount to manage and maintain over time
- Improve users’ ability to navigate the site and find what they came looking for

More e!cient and engaging



Clean out the clutter



Clean out the clutter
Improve usability



"We’re going to use mobile as a lens to make
all our content better, regardless of platform."
— Karen McGrane,
Content Strategy for Mobile


- Writing for mobile is just good writing.
- There are arguments about whether a mobile context exists at all — whether you should design differently for someone waiting at a bus stop or an airport versus
someone sitting down at their desk.
- Good news for content people is that it doesn’t matter because one benefits the other — mobile platforms place the most constraints on writing (length,
simplicity), so if we write for the environment with the most constraints, we're also cleaning up the clutter from our (now) more flexible desktop sites.

Focus Your
Content


- Cluttered web page is like a business's phone answering service that's too long:
* Reads you the hours of operation, exceptions for certain holidays, emergency contact numbers, the weather, then finally gets to the menu that says "Press 1 to
reach billing department, Press 2 to schedule an appointment…" Which is all you really wanted to hear in the first place.
- Similarly, if you clutter up your web page with news and events, announcements, employees of the month, mission and vision statements, and messages from the
dean or director, your users can't quickly see your navigational links to Academic Programs, Admissions, Student Life, etc., which in most cases, is the content
they’re actually looking for.
- Website should be more like a touch-screen menu at a bank, not a department’s whole filing cabinet of text.

What are some content problems
for responsive sites?


Higher education styles, or content types speciﬁc to libraries and museums?

Content Issues
Speciﬁc to Higher Ed


Content Issues
Looooong pages


Content Issues
Looooong pages
Multiple authors


Content Issues
Looooong pages
Multiple authors
Departmental “silos”


Content Issues
Looooong pages
Multiple authors
Departmental “silos”
Academic style


Content Audit



- Representative sample is ok: broad and deep
* some from each section (admissions, academics...)
* four or ﬁve levels down
* make sure you get some from each content type (news, policies, degrees, department landing pages...)

Auditing tips


- Live document, google spreadsheet
- Train trusted users, interns with no political ties, etc. to help you evaluate pages and ﬁll in the spreadsheet.
Review for internal validity!
- Agree on criteria for deletion: "We should delete content that…" vet it, then apply objectively.

Auditing tips
Keep it alive



Auditing tips
Keep it alive
Share responsibility



Auditing tips
Keep it alive
Share responsibility
De"ne your terms



Categories for mobile


Problem images: tables, infographics, etc. that need to display at a large size or speciﬁc dimensions

Word/character counts



Problem images



Problem images
File format (html, .pdf, .doc, .ppt)



Problem images
File format (html, .pdf, .doc, .ppt)
Content housed in Flash



Content
Modeling


A

A

B
B

E

C

Structured
Content

F

D
G

C
D
E
F
G


- Responsive design is not just about designing a way to display graphics and images.
- You also have to structure your content so that it will display properly in multiple formats, so:
* subheads with important information don’t disappear
* inline images with relevant or critical content don’t get lost at certain breakpoints
* don’t put anything essential in sidebars that display above the fold on desktop but get bumped to the bottom on a vertically


- Article in a Typical CMS:
* Looks simple, doesn’t appear to be a lot of pieces
* Title, giant WYSIWYG blob for “body text”
- Gives the writer (or content paster) control over layout on a desktop page, but some people should not be given
control over those type of decisions...


Break it down structurally by function:
* Title/header
* Lead
* Detail copy
* Pull quote
* Related articles
* Custom teasers for RSS feeds or landing pages

Writing &
Editing


Sometimes you won’t have a staff to help you complete a content audit, or time from developers to help you
structure your content by creating new ﬁelds in the CMS.
The following are some actual tips anyone with edit access to a page can do to make it less likely to break your
mobile view on a responsive site.


Editing does take effort, but especially if you’re doing a redesign, think in terms of “Would many long pages of content be worth
the effort if you had to manually move them each over?”
Pages that just look long and wordy on a desktop site seem to scroll on forever in mobile
Even with a good responsive design, content can be hard to let go of.


A lot of content owners think of it not as not wanting to "lose" any content on the old site, they want to know where it will map to the new content structure. Instead,
try to get them to think about what is worthy of the new site? What supports users' goals and the goals of the organization? Is all that extra content helping you or
harming you?
Long pages: Presenter's paradox, Kimberlee Weaver, Virginia Tech
* People presenting information often want to provide as much as possible, ﬁlling in their main ideas and “great” content with other good details to support it.
* But psychology and marketing researchers have found that adding more information can weaken your message; adding "good" supporting ideas to "great" ones
dilutes your whole intent in the mind of the reader.

Get to the Point


* Inverted pyramid, don’t bury the lede
- The old advice: “tell them what you’re going to say, say it, then tell them what you just told them”
* Instead, leave out transitions and framing language like “The following information will...” “Welcome to the department of...”
* Writers use as a shortcut to get started, but removing will make things instantly shorter, and users won’t miss it
- Place your call to action at the top, rather than beneath paragraphs of text that scroll on for days

Get to the Point
Put most important info right up front



Get to the Point
Skip the pleasantries



Get to the Point
Skip the pleasantries
Prioritize your call to action



Good (Mobile) Style


- No marketing language, jargon: watch your adjectives and give examples, details instead
* “world-class faculty, engaged students, beautiful campus”
- One-sentence paragraphs are ok. So are fragments.
* Use shorter sentences and minimize commas and hyphens—will not only help you with responsive design, but is good for SEO purposes.
* Don’t have to write like a third-grader, but 14 clauses with 8 semi-colons and 3 dashes are too much when users are reading a screen, especially
a tiny one.
- Speaking to users with second-person “you” will not only shorted stiffly worded workarounds, but help you keep the rest of the language more

Good (Mobile) Style
Cut the #u$


a tiny one.

Good (Mobile) Style
Cut the #u$
Less Joyce, more Hemingway


a tiny one.

Good (Mobile) Style
Cut the #u$
Less Joyce, more Hemingway
Speak to users, not about them


a tiny one.

Formatting

- People don’t read the web the same way they do books and magazines
* Use lots of headers and white space to give their eye a place to land
* Make sure to keep header and content styles consistent throughout the site
* Inconsistent usage will become more obvious as the styles are used to determine how that content is presented on smaller screens.
- Bulleted lists hep with scanning and are a convenient, clean way to get complex info across
- Bold, Italic, underline, colored text compete for attention and chop up your copy.
* Instead, Stock your links and headers with keywords and use consistent styling.
* Removing extra words competing for attention is the best way to get them noticed.

Formatting
Make it scannable/scrollable


Formatting
Befriend bulleted lists


Formatting
Simplify formatting


Formatting
Simplify formatting
Don’t hide relevant content in PDFs


Making a
Change


Recommendations


- Hire a freelancer or short-term specialist to get you through the project, then have a solid plan to take over when you get to the maintenance
stage.
- How do you eat an elephant?
*Work in sections or on top-level content until you can a handle on it. Most university sites have thousands of pages, so be patient.
- Share the work among content owners and writers for each department you can train to edit and do a quick review with later. Break things up in a
spreadsheet (like a content audit) with deadlines and names of people responsible so that everyone knows what to expect.

Recommendations
If your product is content, invest in people who
specialize in it


stage.

Recommendations
specialize in it
Plan manageable chunks


stage.

Recommendations
specialize in it
Plan manageable chunks
Enlist help


stage.

Thank you!

Please rate this session:
http://eduiconf.org/sessions/writing-content-thatworks-everywhere-including-iphones/
@rdelaude
Slides available: www.insidenewcity.com


Writing Content that Works Everywhere edUi

Recommandé

Recommandé

Contenu connexe

En vedette

En vedette (7)

Dernier

Dernier (20)

Writing Content that Works Everywhere edUi