Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
MORE THAN A STORY School Newspapers Online
MORE THAN A STORY In print, readers use various elements to enter the page: Photos, graphics, pulled quotes, sidebar...
MORE THAN A STORY Online, the story page experience is linear. Readers start at the top and scroll to the bottom.
At least we hope so. A story page needs design to move the reader along. MORE THAN A STORY
We need MORE THAN A STORY MORE THAN A STORY
Give readers context. Take advantage of unique aspects of the Web. Make the story look nice. MORE THAN A STORY
MORE THAN A STORY BUILDING THE STORY PAGE
MORE THAN A STORY BASIC PAGE Headline Featured image Text
BASIC PAGE + DECK MORE THAN A STORY Headline Deck Featured image Text
MORE THAN A STORY BASIC PAGE + SIDE IMAGE Headline Deck Featured image now located on the side Text
MORE THAN A STORY BASIC PAGE + LARGE HEADLINE Larger headline Deck Featured image located on the side Text
BASIC PAGE + SMALLER HEADLINE MORE THAN A STORY Smaller headline Deck Featured image located on the side Text
MORE THAN A STORY BASIC PAGE + POLL Headline and deck Featured image located on the side Poll Text
BASIC PAGE + RELATED STORIES MORE THAN A STORY Headline and deck Featured image located on the side Poll Text Rel...
MORE THAN A STORY BASIC PAGE + PULLED QUOTE Headline and deck Featured image located on the side Pulled quote Poll...
BASIC PAGE + PULLED QUOTE/MUG Pulled quote with mug MORE THAN A STORY Headline and deck Featured image located on t...
Pulled quote with mug MORE THAN A STORY BASIC PAGE + INFOGRAPHIC Headline and deck Featured image located on the si...
Pulled quote with mug MORE THAN A STORY BASIC PAGE + HYPERLINKS Headline and deck Featured image located on the sid...
MORE THAN A STORY EIGHT EXTRA ELEMENTS
These extra elements reflect choices you’re making to communicate information to the reader. MORE THAN A STORY
MORE THAN A STORY Ask yourself: What does a reader need to understand this story?
PHOTOS 1• Photos add visual interest, and they display with MORE THAN A STORY the story in the home page content widget...
2VIDEO • Short video clips work great to show an event or parts of an interview. A longer video can replace the story te...
AUDIO 3• Short audio clips work great to show the sounds MORE THAN A STORY of an event or to set the tone of an intervi...
4POLLS • Adding a poll to a story lets your readers interact as they read. • They can also spur conversation and engage...
5HYPERLINKS • Adding links from the text to outside sources can help create context for your story. • These can be for b...
6INFOGRAPHICS • Infographics work well for opinion stories (basis for article) or showing statistics in a visual way. • ...
7PULLED QUOTES • Pulled quotes emphasize a quotation or idea from the text to help reinforce a point and to keep the rea...
RELATED STORIES 8• A list or box with related stories helps the reader see past coverage of the topic, especially if the ...
MORE THAN A STORY EXTRAS IN ACTION
Pulled quote with mug MORE THAN A STORY Photo slideshow Pulled quote Tyrone Area HS, Tyrone, Pa. tyroneeagleeyenews....
MORE THAN A STORY Featured image Pulled quote La Costa Canyon HS, Carlsbad, Calif. mavlifenews.com
MORE THAN A STORY Pulled Quote Sweet Graphic Westside HS, Omaha, Nebraska westsidewired.org
MORE THAN A STORY Featured image Poll Edina (Minn.) HS edinazephyrus.com
MORE THAN A STORY Wordy summary deck Featured image Video Pulled quote Related stories box Hyperlinks Benilde-St. ...
MORE THAN A STORY YOUR TURN!
MORE THAN A STORY Take a printed story and indicate the extra elements you’d add.
What does the story need? What can you include online? MORE THAN A STORY • Photos • Video • Audio • Polls • Hyperl...
MORE THAN A STORY BEST PRACTICES
MORE THAN A STORY G O A L S: • Entice the reader to read. • Facilitate the reader’s understanding. • Encourage the r...
MORE THAN A STORY B E S T P R A C T I C E Embed the elements at appropriate intervals. Avoid awkward gaps or skinny ...
MORE THAN A STORY B E S T P R A C T I C E Avoid “bumping” elements — items that are right next to each other.
B E S T P R A C T I C E Pay attention to effects of centered items, which can cut off text and imply the MORE THAN A ...
B E S T P R A C T I C E Make sure items near the end of the story are wrapped with text. Don’t let those embedded MOR...
MORE THAN A STORY B E S T P R A C T I C E Preview your page. What’s missing? How does it look on a phone or tablet?
MORE THAN A STORY MANAGING YOUR TEAM
CONFER IN ADVANCE 1• When story is assigned, discuss with the writer the possible coverage elements, especially photos. ...
DISTRIBUTE THE WORK 2• Writer should be able to provide: • Story in draft mode • Hyperlinks to background or source mate...
WEB EDITORS 3AREN’T CLERKS • Web editors are presentation managers who understand how a story can be told online. • Add...
Give readers context. Take advantage of unique aspects of the Web. Make the story look nice. MORE THAN A STORY R E M...
MORE GIVE READERS THAN A STORY
QUESTIONS? FIRE AWAY. School Newspapers Online contact@snosites.com schoolnewspapersonline.com
Upcoming SlideShare
Loading in …5
×

More Than a Story

7,382 views

Published on

Learn to package and present information on the story page — beyond just the story text. See best practices for headlines, captions, graphics, images, audio and video. Discover new ways to deliver information to your online audience through embedded information and context.

Published in: Education, News & Politics, Technology
no profile picture user

  • Login to see the comments

More Than a Story

  1. 1. MORE THAN A STORY School Newspapers Online
  2. 2. MORE THAN A STORY In print, readers use various elements to enter the page: Photos, graphics, pulled quotes, sidebars
  3. 3. MORE THAN A STORY Online, the story page experience is linear. Readers start at the top and scroll to the bottom.
  4. 4. At least we hope so. A story page needs design to move the reader along. MORE THAN A STORY
  5. 5. We need MORE THAN A STORY MORE THAN A STORY
  6. 6. Give readers context. Take advantage of unique aspects of the Web. Make the story look nice. MORE THAN A STORY
  7. 7. MORE THAN A STORY BUILDING THE STORY PAGE
  8. 8. MORE THAN A STORY BASIC PAGE Headline Featured image Text
  9. 9. BASIC PAGE + DECK MORE THAN A STORY Headline Deck Featured image Text
  10. 10. MORE THAN A STORY BASIC PAGE + SIDE IMAGE Headline Deck Featured image now located on the side Text
  11. 11. MORE THAN A STORY BASIC PAGE + LARGE HEADLINE Larger headline Deck Featured image located on the side Text
  12. 12. BASIC PAGE + SMALLER HEADLINE MORE THAN A STORY Smaller headline Deck Featured image located on the side Text
  13. 13. MORE THAN A STORY BASIC PAGE + POLL Headline and deck Featured image located on the side Poll Text
  14. 14. BASIC PAGE + RELATED STORIES MORE THAN A STORY Headline and deck Featured image located on the side Poll Text Related stories
  15. 15. MORE THAN A STORY BASIC PAGE + PULLED QUOTE Headline and deck Featured image located on the side Pulled quote Poll Text Related stories
  16. 16. BASIC PAGE + PULLED QUOTE/MUG Pulled quote with mug MORE THAN A STORY Headline and deck Featured image located on the side Poll Text Related stories
  17. 17. Pulled quote with mug MORE THAN A STORY BASIC PAGE + INFOGRAPHIC Headline and deck Featured image located on the side Poll Infographic Text Related stories
  18. 18. Pulled quote with mug MORE THAN A STORY BASIC PAGE + HYPERLINKS Headline and deck Featured image located on the side Poll Infographic Text Related stories Hyperlinks
  19. 19. MORE THAN A STORY EIGHT EXTRA ELEMENTS
  20. 20. These extra elements reflect choices you’re making to communicate information to the reader. MORE THAN A STORY
  21. 21. MORE THAN A STORY Ask yourself: What does a reader need to understand this story?
  22. 22. PHOTOS 1• Photos add visual interest, and they display with MORE THAN A STORY 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.
  23. 23. 2VIDEO • 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. MORE THAN A STORY
  24. 24. AUDIO 3• Short audio clips work great to show the sounds MORE THAN A STORY 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.
  25. 25. 4POLLS • 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. MORE THAN A STORY
  26. 26. 5HYPERLINKS • 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. MORE THAN A STORY
  27. 27. 6INFOGRAPHICS • 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. MORE THAN A STORY
  28. 28. 7PULLED QUOTES • 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. MORE THAN A STORY
  29. 29. 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. MORE THAN A STORY
  30. 30. MORE THAN A STORY EXTRAS IN ACTION
  31. 31. Pulled quote with mug MORE THAN A STORY Photo slideshow Pulled quote Tyrone Area HS, Tyrone, Pa. tyroneeagleeyenews.com
  32. 32. MORE THAN A STORY Featured image Pulled quote La Costa Canyon HS, Carlsbad, Calif. mavlifenews.com
  33. 33. MORE THAN A STORY Pulled Quote Sweet Graphic Westside HS, Omaha, Nebraska westsidewired.org
  34. 34. MORE THAN A STORY Featured image Poll Edina (Minn.) HS edinazephyrus.com
  35. 35. MORE THAN A STORY Wordy summary deck Featured image Video Pulled quote Related stories box Hyperlinks Benilde-St. Margaret’s School St. Louis Park, Minn. bsmknighterrant.com
  36. 36. MORE THAN A STORY YOUR TURN!
  37. 37. MORE THAN A STORY Take a printed story and indicate the extra elements you’d add.
  38. 38. What does the story need? What can you include online? MORE THAN A STORY • Photos • Video • Audio • Polls • Hyperlinks • Infographics • Pull quote • Related Stories
  39. 39. MORE THAN A STORY BEST PRACTICES
  40. 40. MORE THAN A STORY G O A L S: • Entice the reader to read. • Facilitate the reader’s understanding. • Encourage the reader to keep scrolling.
  41. 41. MORE THAN A STORY B E S T P R A C T I C E Embed the elements at appropriate intervals. Avoid awkward gaps or skinny columns of text.
  42. 42. MORE THAN A STORY B E S T P R A C T I C E Avoid “bumping” elements — items that are right next to each other.
  43. 43. B E S T P R A C T I C E Pay attention to effects of centered items, which can cut off text and imply the MORE THAN A STORY story is complete.
  44. 44. B E S T P R A C T I C E Make sure items near the end of the story are wrapped with text. Don’t let those embedded MORE THAN A STORY items dangle!
  45. 45. MORE THAN A STORY B E S T P R A C T I C E Preview your page. What’s missing? How does it look on a phone or tablet?
  46. 46. MORE THAN A STORY MANAGING YOUR TEAM
  47. 47. 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. MORE THAN A STORY
  48. 48. 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. MORE THAN A STORY
  49. 49. WEB EDITORS 3AREN’T CLERKS • 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. MORE THAN A STORY
  50. 50. Give readers context. Take advantage of unique aspects of the Web. Make the story look nice. MORE THAN A STORY R E M E M B E R
  51. 51. MORE GIVE READERS THAN A STORY
  52. 52. QUESTIONS? FIRE AWAY. School Newspapers Online contact@snosites.com schoolnewspapersonline.com

×