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.

PSEWEB: Pre-Conference Web & Social Media 101/Crash Course

1,495 views

Published on

Published in: Education, Technology, Business
  • Be the first to comment

  • Be the first to like this

PSEWEB: Pre-Conference Web & Social Media 101/Crash Course

  1. 1. SOCIAL MEDIA & WEB 101 Pre-Conference Workshop PSEWEB 2011
  2. 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. 3. AGENDA1. Web − Fundamentals, Technologies2. Search − Organic, Paid3. Social Media − Email, Blogs, Social Networks4. MultiMedia − Video, Images, YouTube, Flickr5. Mobile − Apps, Websites, Geo-Location
  4. 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 TechnologiesPhoto by Oldonliner
  5. 5. WEBSITES− Just one of many platforms website website− Authoritative answers to website specific questions− Support & guidance The Internet
  6. 6. WEBSITES− Just one of many platforms youtube websites facebook− Authoritative flickr linkedin answers to specific questions twitter− Support & guidance The Internet
  7. 7. WEB PROCESS− Strategy − Design− Architecture − Development− Content − Testing− User Experience − Maintenance− Functionality − Approvals
  8. 8. STRATEGY• Business Objectives • Budget• Brand Positioning • Timeline• Audiences (& • Technologies Audience • Stakeholders Objectives) • Approvers• Goals (Metrics • Editors Planning)• Content, Media Assets
  9. 9. ARCHITECTURE
  10. 10. INFORMATION ARCHITECTURE 3.0?
  11. 11. ARCHITECTURE• Elements• Character Counts• Functional Notes• Navigation• Location
  12. 12. ARCHITECTURE• Elements• Character Counts• Functional Notes• Navigation• Location
  13. 13. CONTENT• Copy • Downloads• Images • Metadata• Video • Links• Animation
  14. 14. USER EXPERIENCE• Navigation• Accessibility• Performance• Testing – Interviews – Groups – Click tracking
  15. 15. AKA CONVERSIONS?• Navigation• Accessibility• Performance• Testing – Interviews – Groups – Click tracking
  16. 16. CONTENT VS DESIGNCSS, XHTML & Javascript
  17. 17. CONTENT VS DESIGNCSS, XHTML & Javascript
  18. 18. CONTENT VS DESIGNCSS, XHTML & Javascript
  19. 19. ORGANIC SEARCH
  20. 20. CONTENT VS DESIGNCSS, XHTML & Javascript
  21. 21. CONTENT VS DESIGNCSS, XHTML & Javascript
  22. 22. CONTENT VS DESIGNCSS, XHTML & Javascript
  23. 23. CONTENT VS DESIGNCSS, XHTML & Javascript
  24. 24. CONTENT VS DESIGNCSS, XHTML & Javascript
  25. 25. EDITING SOFTWAREFor CSS, XHTML & Javascript• Microsoft Frontpage (Sharepoint Designer)• Adobe Dreamweaver• Notepad++
  26. 26. CONTENT MANAGEMENT SYSTEMSDesign, Content & Structure are separated. Consistent look & feel. User types, permissions & workflow. Often database driven.
  27. 27. CONTENT MANAGEMENT SYSTEMSCustom/Internal .NET Proprietary PHP Open Source Java XSLT
  28. 28. CONTENT MANAGEMENT SYSTEMSProprietary Open Source• Hannon Hill Cascade • Drupal Server • Joomla• TERMINALFOUR • Wordpress• OmniUpdate • Umbraco• SiteCore• Expression Engine• Ektron
  29. 29. CONTENT MANAGEMENT SYSTEMSProprietary Open Source• $250 to $100,000 • Free• Can be “blackbox” • Flexible• Customer Support • Community• Partners • Unregulated?• Accountable
  30. 30. LANGUAGES• PHP • Java• .NET • Javascript• HTML/XHTML (jQuery)• XML • Flash
  31. 31. WEB PROCESS− Strategy − Design− Architecture www.edustyle.net− Content − Development− User Experience − Testing− Functionality − Maintenance − Approvals
  32. 32. MEDIAHosting, Accessibility, Opportunities
  33. 33. ALT/TITLE ATTRIBUTES Required by Ontario Disabilities Act Communicate the imageCorrect spelling, punctuation, capitalization
  34. 34. PHOTO SOFTWARE REQUIRED Images must be sized to the actualdisplay size before they are uploaded to prevent distortion & to improve performance.
  35. 35. PHOTO SOFTWARE REQUIRED Adobe Photoshop www.pixlr.com/express
  36. 36. IMAGE STYLING
  37. 37. FLICKR• RSS > Webpages, Blogs, Microsites• Push to Twitter• Email photo submission
  38. 38. VIDEO HostingAccessibility
  39. 39. 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
  40. 40. SEARCHOrganic vs Sponsored Tricks & Tips
  41. 41. ORGANIC SEARCH
  42. 42. 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
  43. 43. PAID SEARCH
  44. 44. PAID SEARCH• Pay-per-click• Auction Environment• Unlimited copy/creative variations• Target by region, language, keyword• Social referral
  45. 45. TIPS & TRICKS
  46. 46. RSS: REALLY SIMPLE SYNDICATION One desk, five hundred sites, minimal migraines.
  47. 47. 1
  48. 48. 22
  49. 49. 3
  50. 50. 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
  51. 51. MAKE YOUR OWN RSS• Delicious.com or Google Reader Account• Browser Bookmark (IE/Firefox)• Connect resulting RSS to website, facebook, twitter, etc.
  52. 52. TRACK YOUR RSS
  53. 53. ALLOW EMAIL SUBSCRIPTION
  54. 54. 15 MINUTES TO MOBILE
  55. 55. THE SOCIAL WEBThe Internet is by definition “social” and always has been.
  56. 56. THE SOCIAL WEB Online social networks are technology‟s response to a network-based society,providing tools for creating and maintaining connections.
  57. 57. 33% OF 2010 APPLICANTSSEARCHED FOR SCHOOLS ONSOCIAL 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
  58. 58. HOW DO WE USE IT?Photo by zizzy
  59. 59. LOOK, LISTEN, JOIN, SPEAKPhoto by zizzy
  60. 60. HOW DO THEY USE IT?Photo by zizzy
  61. 61. Create: Blog Posts Videos Animation Photography NewsPhoto by wonderfullycomplex
  62. 62. CONNECT Connect: Friends Family Classmates Employers PeersPhoto by erica_marshall
  63. 63. COLLABORATE Collaborate: Research Schoolwork Planning Knowledge GroundswellPhoto by markop
  64. 64. REACT Comment/Critique: Restaurants Politics Celebrities Movies Each OtherPhoto by altemark
  65. 65. ORGANIZE Organize: Bookmarks Events Tasks Projects Each OtherPhoto by counteract
  66. 66. CONSUMPTION Accelerate Consumption: News Music Conversation VideoPhoto by pss
  67. 67. CONNECT Now we will discuss: -Blogs -Social Networks -Rich Media -MobilePhoto by erica_marshall
  68. 68. BLOGS– Syndicated Content– Presented in Reverse Chronological– Powered by RSS– Comments
  69. 69. WITHOUT COMMENTS, YOU DO NOT HAVE A BLOG.
  70. 70. 2 guys who like video games, sarcasm and drawing
  71. 71. FunInteractive Engaging Usable
  72. 72. Today Penny Arcade runs a massiveannual game expo and sponsors a charitythat has donated (as of this writing) $4.9 million worth of electronics and video games to childrens hospitals
  73. 73.  Bring the crisis home Shape the message
  74. 74. • Fun• Interactive• Engaging
  75. 75. • Strong Creative• Consistent Architecture & Template
  76. 76.  Redesigned to WordpressMU Strong Creative Consistent Architecture & Template
  77. 77. BLOGGING BEST PRACTICES:– Enthusiastic Content Providers– Engaged Readers– Syndicate Your Content– Comment Policy– Invest in Design
  78. 78. BLOG OPPORTUNITIES– Engage– Inform– Brand– Soapbox
  79. 79. SOCIAL NETWORKS– Online Community– Individual Profiles– Autobiographical– Interaction
  80. 80. ELEMENTS OF A SOCIAL NETWORK PROFILE
  81. 81. Communication NameDisplay Picture ELEMENTS OF A SOCIAL NETWORK PROFILE Share Content Personal Information Connections Interaction
  82. 82. Social networking use amonginternet users ages 50 and older nearly doubled—from 22% in April 2009 to 42% in May 2010.
  83. 83. FACEBOOK
  84. 84. infographic by digitalbuzzblog.com
  85. 85. SO WHAT IS FACEBOOK?• Founded in higher education• Very Canadian• Based on the real-world• Mobile• Affordable and targeted
  86. 86. FACEBOOK IS SOCIAL
  87. 87. melissacheater.com © 2009
  88. 88. GLOSSARY• Profile • Fan• Friend • Poke• Wall • Newsfeed• Status • Groups/Pages• Applications• Like
  89. 89. FACEBOOK GROUPSBring people together within the larger network.
  90. 90.  Strong Creative Regular, relevant communication from admissions
  91. 91. FACEBOOK PAGESYour Facebook page is your homepage on Facebook.
  92. 92. melissacheater.com © 2009
  93. 93. melissacheater.com © 2009
  94. 94. melissacheater.com © 2009
  95. 95. melissacheater.com © 2009
  96. 96. melissacheater.com © 2009
  97. 97. FOR FANS ONLY CONTENT
  98. 98. FACEBOOK PAGE REDESIGN 2011
  99. 99. 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
  100. 100. FACEBOOK BEST PRACTICES- Invest in creative- Consider a work in progress- Respond within 24 hours- Link to syndicated content- Set & Publish Content Guidelines
  101. 101. 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
  102. 102. uOttawa: Seek to Know App
  103. 103.  uOttawa brand on my profile uOttawa in my newsfeed (seen by all connections
  104. 104. TWITTER
  105. 105. microblog 140 charactersmany to many public conversations web, desktop & mobile
  106. 106. CHARACTERISTICS OF TWITTER- Anything you would tell anyone- Real-time or schedule- Manual or automatic- Person or brand- Information or insight- Real or Fake
  107. 107. Watch this video about twitter: http://go.ivey.ca/twittervideo
  108. 108. publiccasualresponsivereal time
  109. 109. GLOSSARY• Retweet (RT)• Mention (@)• Hashtag (#)• Trend (#)
  110. 110. HOW I USE TWITTERprofessional/support/social network @nikkimk @karlynm @epublishmedia@robin2go @mmbc @billyadamsphoto by opacity on flickr
  111. 111. the privacy myth
  112. 112. PLACEHOLDER ACCOUNTS• Create the account• Set as Private Account –Find under Settings once you are logged in• Allow no followers• Only post direct messages *
  113. 113. TIPS FOR TWITTER SUCCESS• Be conversational• Follow people back• Be a person – With a face and a name• Be retweetable• Leverage lists as CRM
  114. 114. CHARACTER COUNTER• http://bit.ly/140counter –Use to keep your tweets under 140 characters
  115. 115. SHORTEN URL‟S• http://bit.ly/ –Use to create short, trackable versions of URL’s
  116. 116. 1 – 2 "best in class" college/higher education examples Icon-Friendly Usable Short URL bit.ly Frequent RichCustom Background Retweet
  117. 117. FriendFeed / Ping.FM Event Tag #followfriday Responsive
  118. 118. OPPORTUNITIES• Mobile• Free SMS broadcast system• Link offline events to web• Real-Time• Appropriate Engagement• Monitoring
  119. 119. 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
  120. 120. SOCIAL NETWORK BP: BE PRESENT• Where your stakeholders want you – Facebook Page/Public Profile – 2013 Groups – Twitter Account
  121. 121. BEST PRACTICES• Observe and adapt• Provide Relevant Content• Be Responsive• Stay Dynamic (Repurpose)• Use Commercial Channels when available• Integrate with www homepage
  122. 122. RICH MEDIA• Photos – Flickr – Photobucket – Facebook• Video – YouTube – uStream – Longtail/Brightcove
  123. 123.  Ivey’s Flickr profile
  124. 124.  Post here and push to Twitter & Facebook, or Post to Facebook and push nowhere
  125. 125.  uVic’s Flickr Group NEW: Flickr Galleries (Show photos of others)
  126. 126. • Stanford’s Branded .EDU YouTube channel• Worth the effort
  127. 127.  UWO’s Web 2.0 directory Fantastic
  128. 128. Mobile
  129. 129. Better PhonesFaster NetworksRicher Content
  130. 130. 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
  131. 131. MOBILE FRIENDLY HOMEPAGE
  132. 132. SEPARATE MOBILE SITE
  133. 133. 1. iPad2. iPhone3. Blackberry 4. iPod 5. Android
  134. 134. LISTEN• Google Alerts – Web – Blog – News – Site Specific• SocialOomph• CoTweet• Notifications (Email, RSS, SMS)• Daily Checks
  135. 135. 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?)
  136. 136. 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 …
  137. 137. THANK YOUmelissa@lunchbreakmedia.comwww.twitter.com/mmbcwww.linkedin.com/in/melissacheaterwww.facebook.com/melissacheaterwww.melissacheater.com

×