Trends in Online Media
Cindy Royal, Ph.D
Associate Professor
Texas State University
School of Journalism and Mass Communication
[email protected]
www.cindyroyal.com
www.onthatnote.com
tech.cindyroyal.net
twitter.com/cindyroyal
facebook.com/cindyroyal
linkedin.com/in/cindyroyal
Milestones in Multimedia
2001
2007
Pre-1995
DotCom Bust
VA Tech Shooting
Wired Magazine - 1993
9/11 Tributes
Twitter tips at SXSW
NY Times on AOL - 1994
Wikipedia launched
Invention of the Year Nando -1994
2002
iPhone
1995
Google News
CNN/ YouTube Debates
Craigslist launched
2008
2003
Slate, Salon, USA Today,
CBS acquires CNET
RSS
Houston Chronicle, Philadelphia
Candidates embrace social media
Google Buys Blogger
1996
Inquirer
EveryBlock.com
MySpace launched
Washington Post
2009
2004
Wall Street Journal
Hudson Plane Crash photo
Jon Stewart on Crossfire
Chicago Tribune
Iran elections
Rathergate
LA Times
Politifact wins Pulitzer
Press Credentials to Bloggers
MSNBC
MSNBC purchases Everyblock
WikiNews, Facebook, Digg
1997
Foursquare & Gowalla
2005
Blackhawk Down
2010
YouTube
1998
iPad released
News Corporation buys
Drudge Report
Wikileaks
MySpace
Google
Facebook -500M Users;
2006
1999
Zuckerberg Person of the
Macaca
Blogger
Invention of the Year -YouTube Year; The Social Network
IndyMedia
2011
2000
Person of the Year - You
Egyptian Protests
AOL/Time Warner merger
Google Buys YouTube $1.65B
Coupon sites
AOL/HuffPo merger
Web Development Categories





Basic HTML design
Programming emerges
Blog Platforms
Content Management Systems
Other
Basic HTML Design





HTML – early 90s, language of the Web
Became XHTML to add structure, conventions –
early 2000's; next gen is HTML5
Cascading Stylesheets – CSS – 1996; next gen
is CSS3
Javascript (1995), Flash (1996), AJAX
Web programming – PHP, ASP, Ruby, Python,
etc.
Web Hosting




Domain registration/hosting – lots of options; I've used
doteasy.com; avahost.net, godaddy.com, bluehost.com
FTP Tools

Fetch (Mac, free) - fetchsoftworks.com

WS-FTP (PC, free) - ipswitch.com

Net2Ftp – net2ftp.com - Web-based FTP

FireFTP – fireftp.mozdev.org - Firefox Add-on
HTML Tutorials

Barebones Guide to HTML - werbach.com/barebones

W3 Schools - w3schools.com/html
Beyond the basics there's Flash, Javascript, PHP, audio and
video editing...
Blog Platforms



Started as platform for online journaling; Web sites for
people who didn't know html.
Early platforms – Open Diary, LiveJournal late '90s
Blogger -started 1999 by Evan Williams (also Twitter) and
Meg Hourihan; purchased by Google 2003

Movable Type – 2001; Six Apart

Wordpress – 2003; can host yourself or on their site

Posterous and Tumblr – fully featured blog platforms;
social media usage
a
Content Management Systems

Wordpress has often been modified as CMS – free on
their site or monthly fee of $< 10/month in most cases
on another host
– With WP, pay for domain and access to CSS to
customize
– Customization requires knowledge of html/css
Drupal

Joomla


Other hosted
CMS
My.HSJ.org system





Provided by ASNE
Simple to use CMS
Ability to upload text,
photos & video
Have blogs
Editing and admin
Other Turnkey Solutions
•
School Newspapers Online –
schoolnewspapersonline.com
•
Wordpress-based, but they design and
customize for you
•
$400-$600 setup fee depending on theme you
choose - includes domain registration, site
setup, hosting, and support
•
$200 renewal per year - includes domain
renewal, hosting, and support
•
Instruction manual available at
Other Online Tools

YouTube

Facebook or MySpace – set up groups; post content; stay in touch

del.icio.us - social bookmark manager

Niche Social Networks


LinkedIn
Flickr/Picasa – photo sharing sites

Animoto/Vuvox – online tools for developing slideshows and video

Second Life – virtual world


Wikipedia - discuss credibility, have students contribute, wisdom of crowd vs.
gatekeepers
Twitter – microblog; good way to add new content to a website on a regular
basis, breaking news, connect with audience.
Free (or cheap) Software!

SoundSlides – make a photo slideshow

Must be hosted on a Web site

Difficult, but not impossible, to embed on a blog

Soundslides ($39.95) must include audio (you can
tweak with a silent file); new Soundslides Plus ($69.95)
lets you choose whether or not to have audio

Audacity – free; edit audio, create mp3 files

iMovie (Mac) or Windows MovieMaker (PC) – video editing

SnapZPro (Mac, $69) /Camtasia(PC or Mac, $99) – screen
capture; use for developing online tutorials
On The Go...



Rise in mobile technology
UStream and Livestream – live stream with
camcorder and laptop
Qik.com & Ustream – stream LIVE video from
your phone!
Equipment


You don't need expensive equipment
Most students have digital cameras or cell
phones that can shoot photos/video

Low-end cameras with video

Digital audio recorders

Camcorders
Developing An Online News Operation

Integrated with your print operation

Digital-first journalism – Web and mobile

A Web editor can approve online stories, assignments for Web-only
projects

1 or more Web producers can be responsible for multimedia aspects

Integration with print and reporters to add visual interest to stories




A content-management system with editor approval that allows
multiple people to post to site
A person with design responsibilities to oversee layout and design
issues
A social media editor who can oversee and integrate Twitter,
Facebook presence, engage audience
Multiple Twitter accounts, staff. Develop a policy with guidelines for
how these accounts/personal accounts should be used.
Use social media to engage audience
• Make it easy for people to share and talk about your
content
• Twitter
• Facebook – pages or groups
• Social bookmarks on posts
• Add widget on site
• Foursquare or Gowalla –
location-based promotion/events
• Flickr/Picasa/Instagram
• YouTube
Keeping Up
• Google News/Yahoo News - Technology
• NY Times Technology/David Pogue
• Wired News
• Scobleizer
• TechCrunch
• Digg
• Web Strategy by Jeremiah Owyang
• Techmeme
• SensibleTalk.com
• Social Media Today
• Mashable
• Smashing Magazine
• 10000 Words
Resources















SXSW Interactive - www.sxsw.com/interactive
Wired Magazine - www.wired.com
Fast Company Magazine – www.fastcompany.com
Cyberjournalist.net - Great Work Gallery www.cyberjournalist.net/category/great-work-gallery
Online Journalism Awards - http://www.journalists.org/
Knight Digital Media Center www.knightdigitalmediacenter.org
Online Journalism Review Archives - ojr.org
Interactive Narratives - interactivenarratives.org/
We The Media by Dan Gillmor
Convergence Culture by Henry Jenkins
The Long Tail and Free by Chris Anderson
What Would Google Do? - Jeff Jarvis
Journalism Next – Mark Briggs
Editor & Publisher Awards royal.reliaserve.com/eppy/winners2008.html
Journal of Computer-Mediated Communication jcmc.indiana.edu
Key Concepts
•
•
•
•
•
•
•
•
•
New media
Social media
Social network
Convergence
Interactivity
Hyperlinks
Hyperlocal
User-generated content
User experience
Key Terms
•
•
•
•
•
•
•
•
•
•
•
Web 2.0
Blog
Microblog
Mobile
Mashup
RSS
Tag/ Tag Cloud
Content Management System
Podcast
Wiki
Web-first or
Mobile First Journalism
• Programmer/Journalist
• Widgets/Plugin/App
• Location-based
Search Engine Optimization
•
•
•
•
•
•
•
•
•
•
•
•
•
Most important thing – get others to link to you
Google Page Rank algorithm
Link to others, they are more likely to link to you
Participate on comments, forums – tactfully include links to your content
Write meaningful headlines – different than print
Write strong teasers – not necessarily your lead
Use phrases (keywords) frequently that you think people will be using to
search for relevant content
Fresh content – update regularly and often
Use keywords in URLs
Consistently use alt tags for images and videos; put content on
video/slideshow pages
Pages should have meaningful titles
Use social media to spread your content, allow users to share
Monitor your search standings and traffic – Google Analytics or other
services
Why Learn HTML

Regardless of the platform you choose, it is helpful to
have a basic understanding of HTML/CSS – the
language of the Web

Ability to customize a CMS

Ability to troubleshoot and add advanced functionality

HTML provides the structure

CSS provides the formatting

Control the entire Web site with a single stylesheet;
make global changes quickly and easily
Basic HTML



Markup language – surround text with proper
markup
Open and close tags properly (i.e.
<html></html>
Sample html page
<html>
<head><title>Cindy's Web Site</title></head>
<body>
<p>This is a paragraph</p>
</body>
</html>
Basic CSS



Use a stylesheet to control the design/layout of
a Web page
Save sheet with .css extension
Insert into the <head> section of each page with
the following code:
<link rel=”stylesheet” href=”style.css” type=”text/css” />
Styles are defined in this manner:
h2
{
font-size: 14px;
font-style: normal;
font-weight: bold;

Image and Graphic Manipulation
• Web resolution – 72dpi
• .jpg for photos; .gif or .png for graphics
• Optimize photos for file size; crop and
adjust
• Photoshop
• Picnik - http://www.picnik.com/
• Webresizer http://www.webresizer.com/resizer/
Video editing









iMovie – available on Macs for free; easy to learn, use
Final Cut Express or Pro – more comprehensive, but
more expensive
Other video options include Window Movie Maker,
Adobe Premiere, Pinnacle, etc.
Ability to import, crop, add transitions, titles, sound
Keep it short
Choose your editing software
Practice visual storytelling
Publish online
Start small, but make sure you start
Gear
• Lots of camera choices
• High Def?
• Accessories – tapes, batteries, microphone,
tripod, headphones, lighting
• Focus, zoom, exposure
• Solid clips – avoid panning and zooming
• Get good audio
Digital Video
• Cheap cameras and editing software
• One person can produce high quality
• YouTube 20 hours of footage uploaded every
minute
• The only way to learn video journalism is by doing it
- Angela Grant (a former student)
• Video journalists or backpack journalists
• Both broadcast and non-broadcast
Plan Video
•
•
•
•
Different approaches for different projects
Storyboarding
Focus story
Choose interview and demonstration
sequences as well as b-roll
• Mix your shots – wide angle, medium,
close-ups
Five shots
•
•
•
•
•
•
Close-up on the hands
Close-up on the face
Prepare your subject
Wide shot
Over-the-shoulder shot
Creative shot
Interviews
• Select a location – think sound and lighting
• Have several pre-written questions – some
can be discussed ahead of time
• Remain silent
• Use a stand-up, just in case
• Effective use of voiceover
Great Multimedia – Photos and Video
•
•
•
•
•
•
New York Times
Statesman
MediaStorm
Washington Post
The University Star – star.txstate.edu
Links and examples at cindyroyal.com/asne
Telling Stories with Data
• New York Times
• Texas Tribune
• Tools – Google Maps; Charts and Visualization;
Fusion Tables
Wordle, Chartle
• Links and examples at cindyroyal.com/asne
Student Projects
• Learn skills in XHTML, CSS, Flash, graphic design, photo, audio, &
video editing
• Digital Storytelling via integration of tools
• Firestation Studios - http://www.jonzmikly.com/final/
• Hill Country Concours - http://cars.martin-whitaker.info/
• Farm 2 Table - http://farm2table.nicmartinez.com/
• NPPA – Future of Journalism Workshop http://www.onesonia.com/nppa/index.html
• South By Texas State – www.sxtxstate.com
• Mass Comm Week – txstatemcweek.com
• University Star – star.txstate.edu
• Course sites 
Web Design – cindyroyal.com/webdesign

Social Media at Work – cindyroyal.com/social

Advanced Online Media - cindyroyal.com/advanced