MORE Logan Aimone, MJE // School Newspapers Online THAN A STORY Tuesday, March 18, 14
May 18, 2015
MORELogan Aimone, MJE // School Newspapers Online
THAN A STORYTuesday, March 18, 14
MORETHAN A STORY
In print, readers use various elementsto enter the page:Photos, graphics,
pulled quotes, sidebarsTuesday, March 18, 14
MORETHAN A STORY
Online, the story page experience is linear.
Readers start at the top and scroll to the bottom.
Tuesday, March 18, 14
MORETHAN A STORY
At least we hope so.A story page needs design to move the reader along.
Tuesday, March 18, 14
MORETHAN A STORY
We need
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
Give readers context.Take advantage of unique
aspects of the Web.Make the story look nice.
Tuesday, March 18, 14
BUILDING THE STORY PAGE
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
HeadlineBASIC PAGE
Featured image
Text
Tuesday, March 18, 14
MORETHAN A STORY
Headline
BASIC PAGE + DECK
Deck
Text
Featured image
Tuesday, March 18, 14
MORETHAN A STORY
Headline
BASIC PAGE+ SIDE IMAGE
Deck
Text
Featured image now located on the side
Tuesday, March 18, 14
MORETHAN A STORY
Larger headline
BASIC PAGE+ LARGE HEADLINE
Deck
Text
Featured imagelocated on the side
Tuesday, March 18, 14
MORETHAN A STORY
Smaller headline
BASIC PAGE+ SMALLER HEADLINE
Deck
Text
Featured imagelocated on the side
Tuesday, March 18, 14
MORETHAN A STORY
BASIC PAGE + POLL
Headline and deck
Poll
Text
Featured imagelocated on the side
Tuesday, March 18, 14
MORETHAN A STORY
BASIC PAGE+ RELATED STORIES
Headline and deck
Poll
Text
Featured imagelocated on the side
Related stories
Tuesday, March 18, 14
MORETHAN A STORY
BASIC PAGE+ PULLED QUOTE
Headline and deck
Poll
Text
Featured imagelocated on the side
Related stories
Pulled quote
Tuesday, March 18, 14
MORETHAN A STORY
BASIC PAGE+ PULLED QUOTE/MUG
Headline and deck
Poll
Text
Featured imagelocated on the side
Related stories
Pulled quote with mug
Tuesday, March 18, 14
MORETHAN A STORY
BASIC PAGE+ INFOGRAPHIC
Headline and deck
Poll
Text
Featured imagelocated on the side
Related stories
Pulled quote with mug
Infographic
Tuesday, March 18, 14
MORETHAN A STORY
BASIC PAGE+ HYPERLINKS
Headline and deck
Poll
Text
Featured imagelocated on the side
Related stories
Pulled quote with mug
Infographic
Hyperlinks
Tuesday, March 18, 14
EIGHT EXTRA ELEMENTS
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
These extra elements reflect choices you’re
making to communicate information to the reader.
Tuesday, March 18, 14
MORETHAN A STORY
Ask yourself:What does a reader need to understand this story?
Tuesday, March 18, 14
MORETHAN A STORY
PHOTOS
1 • Photos add visual interest, and they display with the story in the home page content widgets.
• Spread the photos throughout the story as appropriate, or combine for a slideshow.
• Every photo should have a caption and credit.
• If a story does not have a photo, create a text-based image/logo to accompany it.
Tuesday, March 18, 14
MORETHAN A STORY
VIDEO
2 • Short video clips work great to show an event or parts of an interview. A longer video can replace the story text or complement the longer story.
• Include IFrame (Inline Frame) code to embed video from YouTube, Vimeo or SchoolTube.
• Ideal length is about two minutes.
Tuesday, March 18, 14
MORETHAN A STORY
AUDIO
3 • Short audio clips work great to show the sounds of an event or to set the tone of an interview.
• Include IFrame code to embed audio from SoundCloud or a similar site.
• Ideal length is about 60 seconds at most.
Tuesday, March 18, 14
MORETHAN A STORY
POLLS
4 • Adding a poll to a story lets your readers interact as they read.
• They can also spur conversation and engagement.
• Polls might tip your staff to additional coverage opportunities based on the poll results.
Tuesday, March 18, 14
MORETHAN A STORY
HYPERLINKS
5 • Adding links from the text to outside sources can help create context for your story.
• These can be for background, previous coverage on your site or source material.
Tuesday, March 18, 14
MORETHAN A STORY
INFOGRAPHICS
6 • Infographics work well for opinion stories (basis for article) or showing statistics in a visual way.
• These can replace a photo in a pinch.
• Try infogr.am to create one.
• Remember, your goal is to get readers to understand the story, not just to write the text. That’s why data visualization is important.
Tuesday, March 18, 14
MORETHAN A STORY
PULLED QUOTES
7 • Pulled quotes emphasize a quotation or idea from the text to help reinforce a point and to keep the reader moving through the story.
• Make sure it’s a good quote.
• Add a mug shot of the speaker for variety.
Tuesday, March 18, 14
MORETHAN A STORY
RELATED STORIES
8 • A list or box with related stories helps the reader see past coverage of the topic, especially if the related stories aren’t recent.
• If someone read the story about this year’s Prom, he or she might want to read about last year’s.
• These lists/boxes also organize coverage of a topic over time, like a search for a new principal, or a possible teacher contract strike.
• Providing related stories keep the reader on your site longer.
Tuesday, March 18, 14
EXTRAS IN ACTION
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
Photo slideshow
Tyrone Area HS, Tyrone, Pa.tyroneeagleeyenews.com
Pulled quote
Pulled quote with mug
Tuesday, March 18, 14
MORETHAN A STORY
Featured image
La Costa Canyon HS, Carlsbad, Calif.mavlifenews.com
Pulled quote
Tuesday, March 18, 14
MORETHAN A STORY
Featured image
Edina (Minn.) HSedinazephyrus.com
Poll
Tuesday, March 18, 14
MORETHAN A STORY
Wordy summary deck
Pulled quote
Related stories box
Benilde-St. Margaret’s SchoolSt. Louis Park, Minn.bsmknighterrant.com
Hyperlinks
Featured image
Video
Tuesday, March 18, 14
YOUR TURN!
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
Take a printed story and indicate the extra
elements you’d add.
Tuesday, March 18, 14
MORETHAN A STORY
What does the story need?What can you include online?
• Photos
• Video
• Audio
• Polls
• Hyperlinks
• Infographics
• Pull quote
• Related Stories
Tuesday, March 18, 14
BEST PRACTICES
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
• Entice the reader to read.• Facilitate the reader’s
understanding.• Encourage the reader
to keep scrolling.
G O A L S:
Tuesday, March 18, 14
MORETHAN A STORY
Embed the elements at appropriate intervals.
Avoid awkward gaps or skinny columns of text.
B E S T P R A C T I C E
Tuesday, March 18, 14
MORETHAN A STORY
Avoid “bumping” elements — items that are
right next to each other.
B E S T P R A C T I C E
Tuesday, March 18, 14
MORETHAN A STORY
Pay attention to effects of centered items, which can cut off text and imply the
story is complete.
B E S T P R A C T I C E
Tuesday, March 18, 14
MORETHAN A STORY
Make sure items near the end of the story are wrapped with text.
Don’t let those embedded items dangle!
B E S T P R A C T I C E
Tuesday, March 18, 14
MORETHAN A STORY
Preview your page.What’s missing?
How does it look on a phone or tablet?
B E S T P R A C T I C E
Tuesday, March 18, 14
MANAGING YOUR TEAM
MORETHAN A STORY
Tuesday, March 18, 14
MORETHAN A STORY
CONFER IN ADVANCE
1 • When story is assigned, discuss with the writer the possible coverage elements, especially photos.
• Does the writer need to take candid photos or mug shots? Video? Audio?
• Work through a checklist. Make sure photo editor is in the loop.
Tuesday, March 18, 14
MORETHAN A STORY
DISTRIBUTE THE WORK
2 • Writer should be able to provide:
• Story in draft mode
• Hyperlinks to background or source material.
• A suggested pull quote
• At least one related link from the news website
• Writer can suggest a possible poll for engagement.
• Encourage writers to participate in social media promotion of their stories.
Tuesday, March 18, 14
MORETHAN A STORY
WEB EDITORSAREN’T CLERKS3 • Web editors are presentation managers who
understand how a story can be told online.
• Adding story page elements is not a last-minute task left up to a Web editor.
• They must make the big-picture decisions about placement and publishing schedule, so they rely on reporters to have done the content work.
Tuesday, March 18, 14
MORETHAN A STORY
Give readers context.Take advantage of unique
aspects of the Web.Make the story look nice.
R E M E M B E R
Tuesday, March 18, 14
MOREGIVE READERS
THAN A STORYTuesday, March 18, 14
Logan Aimone, MJE // School Newspapers [email protected] schoolnewspapersonline.com
QUESTIONS?FIRE AWAY.
Tuesday, March 18, 14