1. SOCIAL MEDIA & WEB 101
Pre-Conference Workshop
PSEWEB 2011

2. ABOUT ME
• First website in „97
• Hons BA, Media & Public Interest „06
University of Western Ontario
• Academica Group
• Richard Ivey School of Business
• PSEWEB & Lunch Break Media Ltd.

3. AGENDA
1. Web
− Fundamentals, Technologies
2. Search
− Organic, Paid
3. Social Media
− Email, Blogs, Social Networks
4. MultiMedia
− Video, Images, YouTube, Flickr
5. Mobile
− Apps, Websites, Geo-Location

4. “In the era of social media,
people use technologies to get
what they need from each
other, not traditional
institutions.”
Charlene Li & Josh Bernoff
Groundswell: Winning in a World Transformed by Social
Technologies
Photo by Oldonliner

5. WEBSITES
− Just one of many
platforms website
website
− Authoritative
answers to website
specific questions
− Support &
guidance
The Internet

6. WEBSITES
− Just one of many
platforms youtube
websites
facebook
− Authoritative flickr linkedin
answers to
specific questions twitter
− Support &
guidance
The Internet

7. WEB PROCESS
− Strategy − Design
− Architecture − Development
− Content − Testing
− User Experience − Maintenance
− Functionality − Approvals

8. STRATEGY
• Business Objectives • Budget
• Brand Positioning • Timeline
• Audiences (& • Technologies
Audience • Stakeholders
Objectives) • Approvers
• Goals (Metrics • Editors
Planning)
• Content, Media
Assets

9. ARCHITECTURE

10. INFORMATION ARCHITECTURE
3.0?

11. ARCHITECTURE
• Elements
• Character Counts
• Functional Notes
• Navigation
• Location

12. ARCHITECTURE
• Elements
• Character Counts
• Functional Notes
• Navigation
• Location

13. CONTENT
• Copy • Downloads
• Images • Metadata
• Video • Links
• Animation

16. USER EXPERIENCE
• Navigation
• Accessibility
• Performance
• Testing
– Interviews
– Groups
– Click tracking

17. AKA CONVERSIONS?
• Navigation
• Accessibility
• Performance
• Testing
– Interviews
– Groups
– Click tracking

18. CONTENT VS DESIGN
CSS, XHTML & Javascript

19. CONTENT VS DESIGN
CSS, XHTML & Javascript

20. CONTENT VS DESIGN
CSS, XHTML & Javascript

22. ORGANIC SEARCH

23. CONTENT VS DESIGN
CSS, XHTML & Javascript

24. CONTENT VS DESIGN
CSS, XHTML & Javascript

25. CONTENT VS DESIGN
CSS, XHTML & Javascript

26. CONTENT VS DESIGN
CSS, XHTML & Javascript

27. CONTENT VS DESIGN
CSS, XHTML & Javascript

28. EDITING SOFTWARE
For CSS, XHTML & Javascript
• Microsoft Frontpage (Sharepoint
Designer)
• Adobe Dreamweaver
• Notepad++

29. CONTENT MANAGEMENT SYSTEMS
Design, Content & Structure are separated.
Consistent look & feel.
User types, permissions & workflow.
Often database driven.

35. CONTENT MANAGEMENT SYSTEMS
Custom/Internal .NET
Proprietary PHP
Open Source Java
XSLT

36. CONTENT MANAGEMENT SYSTEMS
Proprietary Open Source
• Hannon Hill Cascade • Drupal
Server • Joomla
• TERMINALFOUR • Wordpress
• OmniUpdate • Umbraco
• SiteCore
• Expression Engine
• Ektron

37. CONTENT MANAGEMENT SYSTEMS
Proprietary Open Source
• $250 to $100,000 • Free
• Can be “blackbox” • Flexible
• Customer Support • Community
• Partners • Unregulated?
• Accountable

38. LANGUAGES
• PHP • Java
• .NET • Javascript
• HTML/XHTML (jQuery)
• XML • Flash

39. WEB PROCESS
− Strategy − Design
− Architecture www.edustyle.net
− Content − Development
− User Experience − Testing
− Functionality − Maintenance
− Approvals

40. MEDIA
Hosting, Accessibility, Opportunities

41. ALT/TITLE ATTRIBUTES
Required by Ontario Disabilities Act
Communicate the image
Correct spelling, punctuation, capitalization

42. PHOTO SOFTWARE REQUIRED
Images must be sized to the actual
display size before they are uploaded to
prevent distortion & to improve
performance.

43. PHOTO SOFTWARE REQUIRED
Adobe Photoshop
www.pixlr.com/express

44. IMAGE STYLING

45. FLICKR
• RSS > Webpages, Blogs, Microsites
• Push to Twitter
• Email photo submission

46. VIDEO
Hosting
Accessibility

47. YOUTUBE
• Free for Educational Institutions
– Including EDU channel with branding
• iPhone/Mobile Friendly
• Embed on any website
• Supports HD
• Play Metrics
• Supports auto-publishing to Twitter,
Facebook

48. SEARCH
Organic vs Sponsored
Tricks & Tips

49. ORGANIC SEARCH

50. ORGANIC SEARCH
• Metadata
– Keywords, Description, Title
• Social Media & RSS
• Links from sites with authority
• Content
– Headings, Links, Images, Copy
• XML Sitemaps
• Media Relations/Brand Positioning

51. PAID SEARCH

52. PAID SEARCH
• Pay-per-click
• Auction Environment
• Unlimited copy/creative variations
• Target by region, language, keyword
• Social referral

53. TIPS & TRICKS

54. RSS: REALLY SIMPLE SYNDICATION
One desk, five hundred
sites, minimal migraines.

55. 1

56. 2
2

57. 3

58. 3 • Ivey in the News
• Upcoming Events
• Faculty/Research Blogs
• Recruitment Blogs
• Student Blogs
• Ivey Business Journal
• Alumni Newsletter
• One-Off
Announcements
• Twitter Feeds
• Flickr Feeds

63. MAKE YOUR OWN RSS
• Delicious.com or Google Reader
Account
• Browser Bookmark (IE/Firefox)
• Connect resulting RSS to
website, facebook, twitter, etc.

64. TRACK YOUR RSS

65. ALLOW EMAIL SUBSCRIPTION

66. 15 MINUTES TO MOBILE

67. THE SOCIAL WEB
The Internet is by definition “social” and
always has been.

68. THE SOCIAL WEB
Online social networks are technology‟s
response to a network-based society,
providing tools for creating and maintaining
connections.

69. 33% OF 2010 APPLICANTS
SEARCHED FOR SCHOOLS ON
SOCIAL NETWORKING SITES
74% THOUGHT SCHOOLS
SHOULD HAVE A PRESENCE ON
SOCIAL MEDIA SITES
2 0 1 0 E - E X P E C TAT I O N S S U R V E Y, N O E L L E V I T Z

70. HOW DO WE USE IT?
Photo by zizzy

71. LOOK, LISTEN, JOIN, SPEAK
Photo by zizzy

72. HOW DO THEY USE IT?
Photo by zizzy

73. Create:
Blog Posts
Videos
Animation
Photography
News
Photo by wonderfullycomplex

74. CONNECT
Connect:
Friends
Family
Classmates
Employers
Peers
Photo by erica_marshall

75. COLLABORATE
Collaborate:
Research
Schoolwork
Planning
Knowledge
Groundswell
Photo by markop

76. REACT
Comment/Critique:
Restaurants
Politics
Celebrities
Movies
Each Other
Photo by altemark

77. ORGANIZE
Organize:
Bookmarks
Events
Tasks
Projects
Each Other
Photo by counteract

78. CONSUMPTION
Accelerate Consumption:
News
Music
Conversation
Video
Photo by pss

79. CONNECT
Now we will discuss:
-Blogs
-Social Networks
-Rich Media
-Mobile
Photo by erica_marshall

80. BLOGS
– Syndicated Content
– Presented in Reverse
Chronological
– Powered by RSS
– Comments

81. WITHOUT COMMENTS, YOU DO
NOT HAVE A BLOG.

82. 2 guys who like video games, sarcasm and
drawing

83. Fun
Interactive
Engaging
Usable

84. Today Penny Arcade runs a massive
annual game expo and sponsors a charity
that has donated (as of this writing) $4.9
million worth of electronics and video
games to children's hospitals

86.  Bring the
crisis home
 Shape the
message

87. • Fun
• Interactive
• Engaging

88. • Strong
Creative
• Consistent
Architecture
& Template

89.  Redesigned to
WordpressMU
 Strong
Creative
 Consistent
Architecture &
Template

90. BLOGGING BEST PRACTICES:
– Enthusiastic Content
Providers
– Engaged Readers
– Syndicate Your Content
– Comment Policy
– Invest in Design

91. BLOG OPPORTUNITIES
– Engage
– Inform
– Brand
– Soapbox

92. SOCIAL NETWORKS
– Online Community
– Individual Profiles
– Autobiographical
– Interaction

93. ELEMENTS OF A SOCIAL NETWORK PROFILE

94. Communication
Name
Display Picture
ELEMENTS OF A SOCIAL NETWORK PROFILE
Share Content
Personal Information
Connections
Interaction

95. Social networking use among
internet users ages 50 and older
nearly doubled—from 22% in
April 2009 to 42% in May 2010.

96. FACEBOOK

97. infographic by digitalbuzzblog.com

98. SO WHAT IS FACEBOOK?
• Founded in higher education
• Very Canadian
• Based on the real-world
• Mobile
• Affordable and targeted

99. FACEBOOK IS SOCIAL

100. melissacheater.com © 2009

101. GLOSSARY
• Profile • Fan
• Friend • Poke
• Wall • Newsfeed
• Status • Groups/Pages
• Applications
• Like

102. FACEBOOK GROUPS
Bring people together within the larger
network.

103.  Strong Creative
 Regular, relevant
communication
from admissions

105. FACEBOOK PAGES
Your Facebook page is your homepage
on Facebook.

106. melissacheater.com © 2009

107. melissacheater.com © 2009

108. melissacheater.com © 2009

109. melissacheater.com © 2009

110. melissacheater.com © 2009

111. FOR FANS ONLY CONTENT

112. FACEBOOK PAGE REDESIGN 2011

113. FACEBOOK PAGE REDESIGN 2011
• Tabs are now a Left Menu
• Photo strip
• Admins are displayed
• Featured Likes
• Notifications
• “Use Facebook as Page”
• Wall is ordered by popularity
• Smaller display image

114. FACEBOOK BEST PRACTICES
- Invest in creative
- Consider a work in progress
- Respond within 24 hours
- Link to syndicated content
- Set & Publish Content
Guidelines

115. OPPORTUNITIES
- Fan Photos/Videos
- Users can contribute
- Mobile Updates
- Users receive status updates on their phone
- Group Messages
- Fan Updates
- Segment
- Facebook Connect
- Anywhere with a login is now a viral opportunity

116. uOttawa: Seek to Know App

119.  uOttawa brand
on my profile
 uOttawa in my
newsfeed
(seen by all
connections

120. TWITTER

121. microblog
140 characters
many to many public conversations
web, desktop & mobile

122. CHARACTERISTICS OF TWITTER
- Anything you would tell anyone
- Real-time or schedule
- Manual or automatic
- Person or brand
- Information or insight
- Real or Fake

123. Watch this video about twitter: http://go.ivey.ca/twittervideo

124. public
casual
responsive
real time

125. GLOSSARY
• Retweet (RT)
• Mention (@)
• Hashtag (#)
• Trend (#)

127. HOW I USE TWITTER
professional/support/social network
@nikkimk @karlynm
@epublishmedia
@robin2go
@mmbc
@billyadams
photo by opacity on flickr

128. the privacy myth

129. PLACEHOLDER ACCOUNTS
• Create the account
• Set as Private Account
–Find under Settings once you are
logged in
• Allow no followers
• Only post direct messages
*

130. TIPS FOR TWITTER SUCCESS
• Be conversational
• Follow people back
• Be a person
– With a face and a name
• Be retweetable
• Leverage lists as CRM

131. CHARACTER COUNTER
• http://bit.ly/140counter
–Use to keep your tweets under
140 characters

132. SHORTEN URL‟S
• http://bit.ly/
–Use to create short, trackable
versions of URL’s

135. 1 – 2 "best in class" college/higher
education examples
Icon-Friendly
Usable
Short URL
bit.ly
Frequent
Rich
Custom Background
Retweet

136. FriendFeed /
Ping.FM
Event Tag
#followfriday
Responsive

139. OPPORTUNITIES
• Mobile
• Free SMS broadcast system
• Link offline events to web
• Real-Time
• Appropriate Engagement
• Monitoring

141. LINKEDIN
• Profiles are positioned as resumes
• Users do not post back and forth on
each others profiles
• Users can post “references” of each
other – one per relationship.
• Tone throughout the network is
professional
• Not relevant for direct from HS market
• Closed to most external sites

144. SOCIAL NETWORK BP:
BE PRESENT
• Where your stakeholders want
you
– Facebook Page/Public Profile
– 2013 Groups
– Twitter Account

145. BEST PRACTICES
• Observe and adapt
• Provide Relevant Content
• Be Responsive
• Stay Dynamic (Repurpose)
• Use Commercial Channels when
available
• Integrate with www homepage

146. RICH MEDIA
• Photos
– Flickr
– Photobucket
– Facebook
• Video
– YouTube
– uStream
– Longtail/Brightcove

147.  Ivey’s Flickr
profile

148.  Post here and
push to Twitter
& Facebook, or
 Post to
Facebook and
push nowhere

150.  uVic’s Flickr
Group
 NEW: Flickr
Galleries
(Show photos
of others)

153. • Stanford’s
Branded .EDU
YouTube channel
• Worth the effort

154.  UWO’s Web
2.0 directory
 Fantastic

155. Mobile

156. Better Phones
Faster Networks
Richer Content

157. Mobile (7 slides)
Opt-in Only
• Opportunities & Current Statistics
Direct
Immediate
One on One or Many to Many
Always accessible
Easy (for them)
Photo by zizzy

158. MOBILE FRIENDLY HOMEPAGE

159. SEPARATE MOBILE SITE

160. 1. iPad
2. iPhone
3. Blackberry
4. iPod
5. Android

168. LISTEN
• Google Alerts
– Web
– Blog
– News
– Site Specific
• SocialOomph
• CoTweet
• Notifications (Email, RSS, SMS)
• Daily Checks

169. PLAY WITH SOCIAL MEDIA
• Build a Facebook profile
• Watch most-watched YouTube videos
• Share pics with Flickr or PhotoBucket
• Tag with Del.icio.us
• Find some blogs that interest you
(why?)

170. RECOMMENDATIONS
• Facebook Page
• Twitter Account
• Sharing widgets
• Adapt for Mobile
• Do nothing just because it‟s always
been done
• Communicate across all relevant
channels
• Watch …

171. THANK YOU
melissa@lunchbreakmedia.com
www.twitter.com/mmbc
www.linkedin.com/in/melissacheater
www.facebook.com/melissacheater
www.melissacheater.com