-
Notifications
You must be signed in to change notification settings - Fork 13
/
index.html
613 lines (571 loc) · 54.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>City Guide to Social Media</title>
<meta name="description" content="Code for America and the City & County of Honolulu have created a guidebook for the city's use of social media">
<meta name="author" content="">
<!-- Le styles -->
<link href="css/style.css" rel="stylesheet"/>
<link href="css/print.css" rel="stylesheet" media="print"/>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href='http://fonts.googleapis.com/css?family=Alfa+Slab+One' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700,300italic,300' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<!-- <link rel="icon" type="image/ico" href="favicon.ico"/> -->
<link rel="icon" type="image/x-icon" href="images/favicon.ico" />
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico" />
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-20825280-6']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body data-spy="scroll" data-target=".subnav" data-offset="100">
<!-- Masthead
================================================== -->
<div id="banner_bg"></div>
<div id="information">
<div id="main_nav_cont" class="subnav">
<div id="nav_cont">
<ul class="nav nav-pills">
<li><a href="#overview">Overview</a></li>
<li><a href="#facebook">Facebook</a></li>
<li><a href="#twitter">Twitter</a></li>
<li><a href="#flickr">Flickr</a></li>
<li><a href="#youtube">YouTube</a></li>
<li><a href="#strategy">Strategy</a></li>
</ul>
</div>
</div>
</div>
<div id="wrapper">
<div id="main_container" class="info">
<div class="main_cont" id="overview">
<h1>Why use social media?</h1>
<div>
<p>It’s fast, it’s viral, it can spark civic engagement, and it’s free.</p>
<p>Social media helps cities in their core mission of reaching more constituents to more broadly share government information and activities. There are more than 1 billion users on Facebook and more than 600 million users on Twitter. It’s the quickest, cheapest way to communicate and interact with your community.</p>
<p>The benefits of using social media are evident: you can write in common language, raise awareness and participation in municipal activities, and build a stronger community. Social media can also increase government transparency, and it allows you to communicate directly with residents.</p>
</div>
<div>
<h2>Things to keep in mind</h2>
<p>Social media does not replace traditional means of communication, rather it should be used to supplement standard methods.</p>
<p>Don’t use social media just to use social media. Have a reason and a message to communicate. Pick and choose the platforms you wish to use, and use them loyally. It’s better to use one or two platforms regularly and well, than multiple networks infrequently and poorly.</p>
<p>Try to keep the number of accounts per platform at a minimum. The more accounts you have, the more you segment your own community and minimize your reach. There are exceptions to the rule, however. Well-known city programs, events, or places that are associated with the city but have no immediate logical affiliation with the city in the minds of residents, should have a separate account. Examples include Zoos, Beaches, Parks, etc.</p>
<p>Don’t use social media if you simply want to broadcast your message; it’s a conversation, and you have to participate by both providing information and listening to feedback.</p>
</div>
<div id="finish_line_cont"></div>
</div>
<!-- Facebook -->
<div class="main_cont" id="facebook">
<h1><img src="img/facebook.png"> Facebook</h1>
<div class="top_art_cont">
<p>With more than 1 billion active users, Facebook is the most widely-used social networking platform in the world. Facebook helps cities connect with residents and build community online. Facebook fanpages are used by many municipal governments to provide residents with information about government services and projects, local events, rules and regulations, and other relevant topics. It’s also a forum to engage in a dialogue with residents, garner feedback, and strengthen relationships with the community.</p>
<p>Here are two examples of city fanpages done well: <a href="http://www.facebook.com/SF">City and County of San Francisco</a> and <a href="http://www.facebook.com/nycgov">City of New York</a>. </p>
<div class="secondnav">
<br />
<ul>
<li>Explore Facebook: <a href="#get-started-fb">Getting Started</a> | <a href="#fundamental-fb"> The Fundamentals </a> | <a href="#tactic-fb"> Tactics</a></li>
</ul>
</div>
</div>
<div class="program_cont row" id="get-started-fb">
<h3 class="ribbon">Getting Started</h3>
<h6><span class="numbers">1.</span> Go to <a href="http://facebook.com">facebook.com</a></h6>
<h6><span class="numbers">2.</span> Log in; or if you don't have a fanpage for your city, create one</h6>
<ul>
<li><span class="arrows">></span> To create a fanpage, you personally must already have an authentic Facebook profile.</li>
<li><span class="arrows">></span> Either log in to it, or sign up for a free account.</li>
<li><span class="arrows">></span> Go to <a href="http://www.facebook.com/pages/create.php">facebook.com/pages/create.php</a>.</li>
<li><span class="arrows">></span> Select the "Company, Organization, or Institution page" option.</li>
<li><span class="arrows">></span> Choose the Category: "Government Organization."</li>
<li><span class="arrows">></span> Create the page name. It should be easily identifiable, include city name in it, and the word "gov" or "city." Shorten the name if possible. Be consistent, try to use the same username throughout all social media.</li>
<li><span class="arrows">></span> Follow the prompts to upload a profile picture. (Use a city logo, group photo, etc).</li>
<li><span class="arrows">></span> Provide basic “About Us” information, and link to your city’s website. Also include some text saying that this page is the "official" page for the city.</li>
<li><span class="arrows">></span> Choose a username: <a href="http://www.facebook.com/username">facebook.com/<i>username</i></a>. <i>Example: <a href="http://facebook.com/nycgov">facebook.com/nycgov</a></i>.</li>
<li><span class="arrows">></span> Follow the prompts to see basic functionality.</li>
</ul>
<h6><span class="numbers">3.</span> Add other administrators to aid in managing the page</h6>
<ul>
<li><span class="arrows">></span> Be sure you're acting under the page name, then select "Edit Page" on the admin panel.</li>
<li><span class="arrows">></span> Select "Admin Roles."</li>
<li><span class="arrows">></span> See <a href="http://www.facebook.com/help/?faq=187316341316631">How to add admins</a> for further assistance.</li>
</ul>
<h6><span class="numbers">4.</span> Add or edit images</h6>
<ul>
<li><span class="arrows">></span> Select a profile picture. This should be a relatively permanent selection and should be the city's seal or logo. This will be the image that shows up on fanpages or posts next to where you make comments.</li>
<li><span class="arrows">></span> Select a cover image that is aesthetically pleasing and relevant to the city. You can update this from time to time.</li>
</div>
<div class="program_cont row" id="fundamental-fb">
<h3 class="ribbon">The Fundamentals</h3>
<h6>There are two primary viewpoints: “Timeline” and “News Feed” </h6>
<ul>
<li><span class="arrows">></span> The “Timeline” is a collection of photos, updates, and interactions between you and your community. This is where you add content to share with your fans. </li>
<li><span class="arrows">></span> The “News Feed” is an aggregate of updates from other organizations, businesses, and people that you have selected to follow. You can share these messages with your own followers by clicking on “Share."</li>
</ul>
<h6>Participate in the community</h6>
<ul>
<li><span class="arrows">></span> It's important to “Like” other city pages, as well as community groups and members, organizations, local businesses, and news outlets. This is how you learn what's going on in your city, gain followers, and build an online community.</li>
<li><span class="arrows">></span> Share photos, videos, information, news articles and other relevant information with the public using the "Share" menu visible from your Timeline.</li>
</ul>
<h6>Post a variety of content</h6>
<ul>
<li><span class="arrows">></span> Don't rely exclusively on text or photos; mix up the content mediums. Rotate through text, articles, video, and photos. </li>
<li><span class="arrows">></span> Make your posts informative and fun. Post street closures and upcoming fairs or festivals. Post a picture from a press conference and from a parade.</li>
</ul>
<h6>Your individual URL</h6>
<ul>
<li><span class="arrows">></span> Each user, city, or organization has its own page, which can be found at <a href="http://facebook.com/username">facebook.com/<i>username</i></a></li>
<li><span class="arrows">></span> The City of West Hollywood keeps its page fresh with a nice mix of interesting content and photos: <a href="http://facebook.com/wehocity">facebook.com/WeHoCity</a></li>
</ul>
<h6>Use “Notes” to write messages or lengthy posts</h6>
<ul>
<li><span class="arrows">></span> You can access the Notes application after you've signed in.</li>
<li><span class="arrows">></span> Go to your fanpage's home page, click "Edit Page," then click "Update Info."</li>
<li><span class="arrows">></span> On the left, click the "Apps" tab. Then, click “Go to App" in the "Notes" section to begin writing a note.</li>
</ul>
</div>
<div class="program_cont row" id="tactic-fb">
<h3 class="ribbon">Tactics</h3>
<h6>Tag people and places in messages and photos</h6>
<ul>
<li><span class="arrows">></span> When typing a post, begin with an " @ " and continue typing the name of the individual, place, or organization you wish to tag.</li>
<li><span class="arrows">></span> If the person or organization is part of your network, the name will auto-complete as you type, and you will be able to select it.</li>
<li><span class="arrows">></span> Notifications will be sent to each party being tagged.</li>
<li><span class="arrows">></span> Tagging shares your post or photo with the networks of those you have identified, allowing for broader visibility.</li>
</ul>
<h6>Interact with your community</h6>
<ul>
<li><span class="arrows">></span> Respond to comments made on your posts or on your wall. Also, make comments on posts of those fanpages you follow.</li>
<li><span class="arrows">></span> Share relevant links from a page you follow, or post links, articles, pictures, or videos that are relevant to your residents.</li>
<li><span class="arrows">></span> Pictures garner high visibility on Facebook and often prompt more interaction than any other type of posting.</li>
<li><span class="arrows">></span> Remember, interacting is not only a great way to build community, but it also makes your city's residents feel that their opinion matters.</li>
<li><span class="arrows">></span> When someone posts to your timeline and is looking for a response, respond. It's called "social" media after all!</li>
<li><span class="arrows">></span> Use Facebook’s built-in analytics, accessible via the admin panel, to get a better idea about which content is driving traffic and shared most. Use the learning to share more inspiring content.</li>
</ul>
<h6>Utilize "Facebook questions"</h6>
<ul>
<li><span class="arrows">></span> You can utilize “Facebook questions” from the "Share" menu to gain insights, get feedback, and encourage participation by community members.</li>
<li><span class="arrows">></span> How to set up a question poll: <a href="http://www.facebook.com/help/facebook-questions">facebook.com/help/facebook-questions</a></li>
</ul>
<h6>Be consistent</h6>
<ul>
<li><span class="arrows">></span> Find a conversational voice and stick to it.</li>
<li><span class="arrows">></span> Be consistent in tone but varied in content. No one wants just pictures or only text. Mix it up.</li>
<li><span class="arrows">></span> Work to post a similar number of content items each day. Minimum, one! But remember, over-posting content will only annoy your fans and cause them to "unlike" your page or hide your content from their news feeds.</li>
</ul>
<h6>Useful resources</h6>
<ul>
<li><span class="arrows">></span> <a href="http://www.facebook.com/government/">Government on Facebook</a></li>
<li><span class="arrows">></span> <a href="http://www.facebook.com/help/">Facebook Help</a></li>
</ul>
</div>
<div id="finish_line_cont"></div>
</div>
<!-- Twitter -->
<div class="main_cont" id="twitter">
<h1><img src="img/twitter.png"> Twitter</h1>
<div class="top_art_cont">
<p>Twitter is one of the most frequented social media networks in existence today. It's designed to instantly connect users to what's most important: you can follow other cities, local business, community leaders, and news outlets. The nature of the platform is viral — individuals passing along one another's comments to their own networks — making it one of the quickest, easiest methods to broadcast information to an expansive audience.<br />
<p> Here is an example of a city that uses Twitter well: <a href="https://es.twitter.com/PhiladelphiaGov">@PhiladelphiaGov</a></li>
<div class="secondnav">
<ul>
<li>Explore Twitter: <a href="#get-started-twt">Getting Started</a> | <a href="#fundamental-twt"> The Fundamentals </a> | <a href="#tactic-twt"> Tactics</a></li>
</ul>
</div>
</div>
<div class="program_cont row" id="get-started-twt">
<h3 class="ribbon">Getting Started</h3>
<h6><span class="numbers">1.</span> Go to <a href="http://twitter.com">twitter.com</a></h6>
<h6><span class="numbers">2.</span> Log in; or if you don't have an account, create one</h6>
<ul>
<li><span class="arrows">></span> If you don't already have a Twitter account (also known as a "handle"), create one. Note: the more Twitter handles you have publishing content, the less effective your overall communication.</li>
<li><span class="arrows">></span> Create a username: it should be easily identifiable, include city name in it (shorten if possible), and the word "gov" or "city".</li>
<li><span class="arrows">></span> Be consistent. Try to use the same username throughout all social media.</li>
<li><span class="arrows">></span> An “ @ ” will be added to the front of the name and will always be included as part of the handle. <i>Example: <a href="https://twitter.com/HonoluluGov">@HonoluluGov</a></i>.</li>
<li><span class="arrows">></span> You will be prompted to build your profile by following others, making your profile searchable by category, and adding character (an image and bio) to your profile. (You have the option to skip this if needed; you can always do this later).</li>
<li><span class="arrows">></span> A verification email will be sent your primary email address. Click the link in the email to confirm your account.</li>
</ul>
<h6><span class="numbers">3.</span> Edit your profile</h6>
<ul>
<li><span class="arrows">></span> If you already have a Twitter account, ensure that your name or handle is easy to recognize, and sounds official.</li>
<li><span class="arrows">></span> At any point, you can change your handle to a more readable, credible, and easily identifiable name while maintaining all your current followers and posts. <i>Example: instead of @HNL_info, use @CityofHNL or @HonoluluGov.</i></li>
<li><span class="arrows">></span> Your profile description should include the words "official" and "government" to ensure that viewers are aware that you are providing official city information.</li>
<li><span class="arrows">></span> Your profile should also include a link to the city or city department website, as well as a link to the complete list of Twitter accounts and hashtags used by the city.</li>
</ul>
</div>
<div class="program_cont row" id="fundamental-twt">
<h3 class="ribbon">The Fundamentals</h3>
<h6>Understand the landscape</h6>
<ul>
<li><span class="arrows">></span> With Twitter, you create tweets to share information with the public and follow others to stay informed.</li>
<li><span class="arrows">></span> Each user has his or her own page, which can be found at <a href="https://twitter.com/username">twitter.com/<i>username</i></a>. This page displays tweets of those you are following, and space to create a tweet on the upper left.</li>
<li><span class="arrows">></span> Tweets are no more than 140 characters long. They can contain links.</li>
<li><span class="arrows">></span> It's important to follow other community groups, community members, local businesses, organizations, governments, and news outlets.</li>
<li><span class="arrows">></span> It's important to not only follow others but to retweet their content to your followers and reply to their posts.</li>
</ul>
<h6>Twitter tricks</h6>
<ul>
<li><span class="arrows">></span> Use shortlinks. You can shorten links at <a href="http://bitly.com">bit.ly</a> or <a href="http://go.usa.gov">go.usa.gov</a>.</li>
<li><span class="arrows">></span> Although Twitter automatically shortens links, using <a href="http://bitly.com">bit.ly</a> or other URL shorteners to tweet a shortlink is best practice because <a href="http://bitly.com">bit.ly</a> also enables you to track and analyze your links.</li>
<li><span class="arrows">></span> Direct messaging: allows you to privately communicate with a follower (only with those users that follow you).</li>
<li><span class="arrows">></span> Retweeting: shares someone else’s tweet with your followers.</li>
<li><span class="arrows">></span> Hashtags: The “ # ” symbol, called a hashtag, is used to categorize messages and associated themes.</li>
</ul>
<h6>Sample tweet</h6>
<ul>
<li>The <a href="https://twitter.com/honolulufest">@honolulufest</a> begins today. Join us downtown from 10-5 for <a href="https://twitter.com/#!/search/%23hula">#hula</a>, <a href="https://twitter.com/#!/search/%23locomoco">#LocoMoco</a> and festivities! <a href="http://bit.ly/OKCyzk">http://bit.ly/OKCyzk</a></li>
</ul>
</div>
<div class="program_cont row" id="tactic-twt">
<h3 class="ribbon">Tactics</h3>
<h6>Minimize accounts</h6>
<ul>
<li><span class="arrows">></span> Keep active Twitter accounts to a minimum. Multiple Twitter accounts will only fragment your audience, and the community of followers you wish to develop won’t be attainable unless account consolidation occurs.</li>
<li><span class="arrows">></span> A new Twitter account or handle should only be created if there is a logical disconnection between the entity and the city, such as a zoo. Or if a department draws a specific, dedicated, yet broad audience that is keen on being kept up-to-date on the departmental functions, such as the police department.</li>
<li><span class="arrows">></span> Instead of multiple Twitter accounts, use hashtags for topics.</li>
</ul>
<h6>Build your community</h6>
<ul>
<li><span class="arrows">></span> Follow others. It's an easy way to get more people to follow you and grow your impression.</li>
<li><span class="arrows">></span> Retweet often. You want people to retweet you, so retweet them. It's a good way to build social capital.</li>
<li><span class="arrows">></span> Tweet a variety of topics and media. Tweet information and notifications, as well as news articles, photos, and less formal comments.</li>
<li><span class="arrows">></span> Share video from your YouTube channel or pictures from Flickr. (View the Flickr & YouTube sections for instructions).</li>
</ul>
<h6>Broaden your reach</h6>
<ul>
<li><span class="arrows">></span> Don’t start tweets with “ @ ” unless you're tweeting <i>at someone</i>. These are considered a <i>reply</i> and are not displayed to as broad of an audience, and look like an internal conversation which will get ignored.</li>
<li><span class="arrows">></span> Use hashtags as often as possible. This allows for broader awareness of your message.</li>
<li><span class="arrows">></span> Create hashtags for a given topic or event such as the Honolulu Pride Parade (#hnlpride). Promote and get your community to use it as well.
<li><span class="arrows">></span> Garner responses by explicitly promoting a hashtag. <i>Example: “What do you think of the new play structure at <a href="https://twitter.com/#!/search/%23Dolorespark">#DoloresPark</a>? Include <a href="https://twitter.com/#!/search/%23Dolorespark">#DoloresPark</a> in reply.”</i></li>
</ul>
<h6>Tips</h6>
<ul>
<li><span class="arrows">></span> When you tweet at someone, use their Twitter handle (name) at the beginning of the tweet. This allows for minimal viewing and indicates that you are speaking directly to that person.</li>
<li><span class="arrows">></span> Reply when mentioned or tweeted at. It's called “social” media after all!</li>
<li><span class="arrows">></span> Don't enable the setting to post your tweets to Facebook. You don't want all your 140-character tweets cluttering up your Facebook news feed. They are different media, intended to be used differently.</li>
<li><span class="arrows">></span> You can post pictures by emailing them to a special email address that's designated for your account. Write any text in the subject of the email.</li>
<li><span class="arrows">></span> Keep your messages short and simple. You don't have to use all 140 characters.</li>
<li><span class="arrows">></span> Learn the lingo. <a href="http://www.webopedia.com/quick_ref/Twitter_Dictionary_Guide.asp">Look up the shorthand</a>.</li>
</ul>
</div>
<div id="finish_line_cont"></div>
</div>
<!--Flickr-->
<div class="main_cont" id="flickr">
<h1><img src="img/flickr.png"> Flickr</h1>
<div class="top_art_cont">
<p>Flickr is a great way to host a comprehensive public database of a city’s photographs. Photos can be viewed by anyone without the need to register an account, so residents can quickly see that recent community event or city function. You can easily share photos from Flickr to other social media platforms.</p>
<p>Here is an example of a city that uses Flickr well: <a href="http://www.flickr.com/photos/weho">City of West Hollywood</a>.</p>
<div class="secondnav">
<ul>
<li>Explore Flickr: <a href="#get-started-flickr">Getting Started</a> | <a href="#fundamental-flickr"> The Fundamentals </a> | <a href="#tactic-flickr"> Tactics</a></li>
</ul>
</div>
</div>
<div class="program_cont row" id="get-started-flickr">
<h3 class="ribbon">Getting Started</h3>
<h6><span class="numbers">1.</span> Go to <a href="http://www.flickr.com">flickr.com</a></h6>
<h6><span class="numbers">2.</span> Log in; or if you don't have an account, create one</h6>
<ul>
<li><span class="arrows">></span> If you have a Yahoo!, Google, or Facebook account, click “Sign in” at the top.</li>
<li><span class="arrows">></span> If not, click “Sign up” to create a new account.</li>
<li><span class="arrows">></span> Follow the prompts. Fill in required information.</li>
<li><span class="arrows">></span> A verification email will be sent your primary email address. Click the link in the email to confirm your account.</li>
<li><span class="arrows">></span> Create a screen name. It should be easily identifiable, include city name in it (shorten if possible), and the word "gov" or "city."<li>
<li><span class="arrows">></span> Create/Upload an icon, the small image that will always be displayed next to your name, such as the logo or crest of the city.</li>
<li><span class="arrows">></span> Customize your URL: turn flickr.com/kfjhasimfhweuare into <a href="http://flickr.com/HonoluluGov">flickr.com/HonoluluGov</a> (this is PERMANENT and cannot be undone).</li>
</ul>
<h6><span class="numbers">3.</span> Personalize your profile </h6>
<ul>
<li><span class="arrows">></span> Add basic info about the city.</li>
<li><span class="arrows">></span> Include the URL to the city's website.</li>
<li><span class="arrows">></span> Include the words "official" and "government" in the profile description to ensure viewers are aware that this is the official Flickr page for the city.</li>
</ul>
</div>
<div class="program_cont row" id="fundamental-flickr">
<h3 class="ribbon">The Fundamentals</h3>
<h6>Upload photos</h6>
<ul>
<li><span class="arrows">></span> You can upload photos one at a time or multiple at a time.</li>
<li><span class="arrows">></span> To upload all photos in a folder: while holding down command [Mac] or control [Windows], press "A". Then click “Upload.”</li>
<li><span class="arrows">></span> To upload select photos: while holding down command [Mac] or control [Windows], click on the specific photos desired. Then click “Upload.”</li>
</ul>
<h6>Add tags</h6>
<ul>
<li><span class="arrows">></span> Tags are words to identify the picture. <i>Examples: Town Hall, June 2012, City of Honolulu, The Greenhouse.</i> </li>
<li><span class="arrows">></span> Tagging photos is very important. It allows for images and sets to easily be found in searches. Whenever someone searches Flickr using a keyword, Flickr aggregates all the images tagged with that keyword.</li>
<li><span class="arrows">></span> Add approximately 3-7 tags, the more the better. The more tags the more searchable the photo is.</li>
<li><span class="arrows">></span> You can add tags to individual photos or to an entire batch of photos.</li>
<li><span class="arrows">></span> You can add tags when first uploading photos, or later, after they have been uploaded. To add tags after they have been uploaded, click "Organize & Create," then "Edit photos," then "Titles, tags, and descriptions."</li>
</ul>
<h6>Organize</h6>
<ul>
<li><span class="arrows">></span> A set is a group of photos that go together and can be viewed as a "set." <i>Example: Town Hall, June 2012.</i></li>
<li><span class="arrows">></span> Sets allow for easy viewing of an event, meeting, or location.</li>
<li><span class="arrows">></span> You can create sets when first uploading photos, or later, after they have been uploaded.</li>
<li><span class="arrows">></span> Collections allow you to bundle sets, allowing for greater organization of your photographs. <i>Example: Town Halls.</i></li>
<li><span class="arrows">></span> To create sets after uploading photos, or to create collections, click on "Organize & Create," then "Sets & Collections," then "Create a new set" or "Create a new collection." Select appropriate photos for the set, or appropriate sets for the collection, then click and drag them into the workspace. Add a title and description of the set or collection.</li>
</ul>
<h6>Manage permissions</h6>
<ul>
<li><span class="arrows">></span> Flickr allows you to control the visibility and downloadability of individual images. It also allows you to control the parameters of reuse (or licensing) for individual images.</li>
<li><span class="arrows">></span> You can set visibility, downloadability, and licensing for individual images as well as for sets and collections.</li>
<li><span class="arrows">></span> To control photo permissions, click on "Organize & Create," then "Sets & Collections." Select the set or collection you wish to adjust, then click on "Batch edit." Then select either "Change permissions" or "Change licensing."
<li><span class="arrows">></span> You can set default visibility and licensing for your entire account. Under the “You” tab, click on "Your Account" then click on the "Privacy & Permissions" tab.
<li><span class="arrows">></span> Licensing is conducted through <a href="http://creativecommons.org">Creative Commons</a> which permits others to use your photos to varying degrees.</li>
</ul>
<h6>Download and save photos</h6>
<ul>
<li><span class="arrows">></span> Flickr allows you to download and save photos that others have posted (assuming permissions allow).</li>
<li><span class="arrows">></span> To download a photo, select it and click on "Actions," then "View all sizes," then select the size of photo you wish to download.</li>
<li><span class="arrows">></span> Currently, Flickr has no batch download option; however, you can try one of these <a href="http://www.flickr.com/services/apps/search/?q=backup/">third-party tools</a>.</li>
</div>
<div class="program_cont row" id="tactic-flickr">
<h3 class="ribbon">Tactics</h3>
<h6>Share photos</h6>
<ul>
<li><span class="arrows">></span> Use Flickr as the main place where you upload all photos.</li>
<li><span class="arrows">></span> Share Flickr photos to other social media platforms, such as Facebook and Twitter, by posting the Flickr photo link.</li>
<li><span class="arrows">></span> Each photo uploaded to Flickr will have a unique URL, as do sets and collections. You can link directly to a specific photo, a set, or a collection of photos.</li>
<li><span class="arrows">></span> When viewing a photo, set, or collection that you wish to share, click on "Share," then copy the link provided under "Grab this link."</li>
<li><span class="arrows">></span> If you are sharing to Twitter, click the "Show short URL" box, copy the shortlink that appears, and paste the link where desired.</li>
<li><span class="arrows">></span> Each photo uploaded will also have a unique HTML embed code. Use this embed code for websites and email blasts if you would like to display that photo nested within the email or website.</li>
</ul>
<h6>View and connect</h6>
<ul>
<li><span class="arrows">></span> Use Flickr as your centralized hub so all your city’s photos can be easily viewable in a single location.</li>
<li><span class="arrows">></span> Photos are one of the most highly viewed posts throughout social media. Be sure to share them!
<li><span class="arrows">></span> Flickr allows you to join groups and add contacts. Joining groups and adding contacts related to your community is a great way to develop a following.</li>
</ul>
<h6>Curate your Flickr account</h6>
<ul>
<li><span class="arrows">></span> Photos are an excellent way to involve the community in an event and literally show what happened at it.</li>
<li><span class="arrows">></span> No one wants to look through 100 photos from an event, especially photos of signage or name tags; don't post these.</li>
<li><span class="arrows">></span> Don't post multiple pictures of the same person or viewpoint. Doing so will bore the viewer and will lose their interest.</li>
<li><span class="arrows">></span> Aim to post a maximum of 15-20 photos from each event.</li>
</ul>
</ul>
</div>
<div id="finish_line_cont"></div>
</div>
<!-- YouTube -->
<div class="main_cont" id="youtube">
<h1><img src="img/youtube.png"> YouTube</h1>
<div class="top_art_cont">
<p>YouTube is a popular platform used to upload, view, and share video. More than two billion videos are viewed every day, with more than 35 hours of video uploaded every minute. Videos are the best way to communicate complex messages or involve the community in events. Use YouTube to share videos of community events or other local activities.</p>
<p>Here are two examples of cities that use YouTube: <a href="http://www.youtube.com/user/cityofraleigh">City of Raleigh</a> and <a href="http://www.youtube.com/user/austintexasgov">City of Austin</a>.
<div class="secondnav">
<ul>
<li>Explore YouTube: <a href="#get-started-yt">Getting Started</a> | <a href="#fundamental-yt"> The Fundamentals </a> | <a href="#tactic-yt"> Tactics</a></li>
</ul>
</div>
</div>
<div class="program_cont row" id="get-started-yt">
<h3 class="ribbon">Getting Started</h3>
<h6><span class="numbers">1.</span> Go to <a href="http://www.youtube.com/">YouTube.com</a></h6>
<h6><span class="numbers">2.</span> If you don't have a YouTube channel, create one.</h6>
<ul>
<li><span class="arrows">></span> If you have a Google account, you can click “Sign In” on the upper right.</li>
<li><span class="arrows">></span> Otherwise, click "Sign In," followed by “Create an account.” Register for an account.</li>
<li><span class="arrows">></span> After you're signed in, click the arrow on the top right (next to your account name), and click "My Channel."</li>
<li><span class="arrows">></span> Click on "Channel Settings." It will prompt you to design your page.</li>
<li><span class="arrows">></span> Edit the channel URL under the "Info & Settings" tab to your preferred username for easier recognition in search results.</li>
<li><span class="arrows">></span> Under the "Tabs" tab, choose the preferred “Activity you will share” settings.</li>
<li><span class="arrows">></span> Choose your preferred "Feed Settings" to best manage the comments that may be posted on your channel.</li>
</ul>
</div>
<div class="program_cont row" id="fundamental-yt">
<h3 class="ribbon">The Fundamentals</h3>
<h6>Upload videos with the Video Manager</h6>
<ul>
<li><span class="arrows">></span> Click "Upload" and choose your preferred method of uploading.</li>
<li><span class="arrows">></span> Change the Title, add a Description, and add tags. <i>Examples: Town Hall, June 2012, City of Honolulu, The Greenhouse</i>.</li>
<li><span class="arrows">></span> Choose preferred settings for Privacy, Category, and License. For License, note that "Creative Commons - Attribution" allows other users to copy and re-edit your video.</li>
<li><span class="arrows">></span> Click "Advanced Settings" to choose additional preferred settings.</li>
</ul>
<h6>Subscribe to other channels</h6>
<ul>
<li><span class="arrows">></span> Everyone has a specific channel and URL: <a href="http://www.youtube.com/mychannel">youtube.com/<i>mychannel</i></a>.</li>
<li><span class="arrows">></span> Find and subscribe to the channels of community groups and members, local businesses, organizations, events, governments, or news outlets.</li>
</ul>
<h6>Share your videos</h6>
<ul>
<li><span class="arrows">></span> Share your videos to other social media platforms such as Facebook and Twitter to ensure they receive broad visibility.</li>
<li><span class="arrows">></span> To share a chosen video, open the video in the YouTube player, click the "Share" button under the video, copy the URL, and paste it to the social network.</li>
</UL>
</div>
<div class="program_cont row" id="tactic-yt">
<h3 class="ribbon">Tactics</h3>
<h6>Keep it short and sweet</h6>
<ul>
<li><span class="arrows">></span> Visitors to YouTube spend little time watching individual videos. The average length of a video viewed on YouTube is 2.5 minutes.</li>
<li><span class="arrows">></span> Shorter videos are watched more often, and more often watched all the way through.</li>
</ul>
<h6>Start socializing</h6>
<ul>
<li><span class="arrows">></span> Participate in the YouTube community by liking and commenting on other videos.</li>
<li><span class="arrows">></span> Respond to comments and questions about your videos.</li>
<li><span class="arrows">></span> Review the videos and monitor which are getting more views or being shared, to better inform future decisions.</li>
<li><span class="arrows">></span> Flip through the YouTube channels to see what others cities and organizations are doing well, and see what's popular. </li>
</ul>
</div>
<div id="finish_line_cont"></div>
</div>
<!--Strategy-->
<div class="main_cont row" id="strategy">
<h1>Strategy</h1>
<div class="program_cont row">
<h3 class="ribbon">Overall</h3>
<ul>
<li><span class="arrows">></span> The point of social media is to easily share information with a community of people and to be able to broadcast messages to a broader audience than you can through other means.</li>
<li><span class="arrows">></span> Designate who the primary person(s) will be to manage the account.</li>
<li><span class="arrows">></span> For those using an existing profile with multiple account managers, designate a centralized location for logins and passwords.</li>
<li><span class="arrows">></span> Promote! Place the Facebook, Twitter, YouTube, and other social account information on business cards, websites, press releases, blogs, and any other locations that can drive traffic.</li>
<li><span class="arrows">></span> Ask questions and try to encourage responses from your social communities. Make your networks a valuable resource for information and insight.</li>
<li><span class="arrows">></span> In general, messaging can be either public or private; private messaging should be minimized and only used when necessary.</li>
<li><span class="arrows">></span> Share everything from press releases and official statements to breaking news and city-wide announcements.</li>
<li><span class="arrows">></span> Social implies a two-way street. Be sure to respond to postings, comments, or tweets in a timely manner.</li>
<li><span class="arrows">></span> Residents view Social Media as a platform to gain insight into city government and to contribute their voice.</li>
<li><span class="arrows">></span> If you have any questions, or don’t understand something, Google it.</li>
<li><span class="arrows">></span> If content is shared that is inappropriate or off-message, delete it if no one responded to it. If it has been noticed, apologize and correct it, don’t just quietly delete it.</li>
<li><span class="arrows">></span> Share your content across all networks, but be sure to tailor the message for each specific network.</li>
<li><span class="arrows">></span> Social Media can be used in addition to existing emergency notification systems, like Honolulu's <a href="http://www.honolulupd.org/info/nixle.htm">Nixle</a>. This is a quick and highly effective way to share important messages, PSA’s, and breaking news with your community.</li>
</ul>
<h3 class="ribbon">Frequency</h3>
<ul >
<li><span class="arrows">></span> Timeliness is key. For events or gatherings, post updates throughout to keep people immediately informed.</li>
<li><span class="arrows">></span> Don’t overwhelm others by over-posting: people will become fatigued and you will lose fans/followers.</li>
<li><span class="arrows">></span> Don’t repeat the same message more than once: it will overwhelm and annoy your audience. </li>
<li><span class="arrows">></span> Don’t become obsolete due to lack of sharing of new information. Try to update your networks a minimum of once per day.</li>
<li><span class="arrows">></span> Don’t post just because you can; only share things worth sharing.</li>
</ul>
<h3 class="ribbon">Tone of Voice</h3>
<ul>
<li><span class="arrows">></span> Create messages that will inspire others to share, like, and comment. The goal is to get your messages reposted and retweeted: this will help the word spread and reach many more people.</li>
<li><span class="arrows">></span> Be casual and engaging, not authoritative and distant.</li>
<li><span class="arrows">></span> Active voice is better than passive voice.</li>
<li><span class="arrows">></span> <i>Example: instead of “Advisory Message: Motorists are urged to avoid Broadway Street in New York City”, write “Avoid Broadway while driving.”</i></li>
<li><span class="arrows">></span> Speak colloquially and use diction that is easy to understand.</li>
<li><span class="arrows">></span> Stay consistent, try to keep a similar style and language for each post.</li>
<li><span class="arrows">></span> Minimize the mentioning of acronyms unless it is already widely understood. For example, many people may not know that “DDOT” stands for “Detroit Department of Transportation.” If you are unsure whether to abbreviate or not, it’s probably best to spell it out.</li>
<li><span class="arrows">></span> If a place, person, or organization you're mentioning in your tweet has a Twitter handle, use that Twitter handle in place of the name. It both notifies them, and shows your social media adeptness and friendliness.</li>
<li><span class="arrows">></span> Keep it short and stick to the point.</li>
</ul>
<h3 class="ribbon">Unique Approaches</h3>
<ul>
<li><span class="arrows">></span> Organize tweetups (in-person meetups) and Twitter chats (organized chats through Twitter around a #hashtag). <i>Examples:</i>
<ul>
<li><span class="arrows">></span> City of Palo Alto’s Mayor’s <a href="http://civiccommons.org/stories/palo-alto-mayor-chats-residents">Twitter chat</a>.</li>
<li><span class="arrows">></span> City of Chicago’s transit authority <a href="http://civiccommons.org/stories/using-social-media-monitor-public-sentiment">culls tweets</a> to gain insight on transit system, respond to complaints, and inform planning efforts.</li></ul>
</ul>
<h3 class="ribbon">Multiple Accounts</h3>
<ul>
<li><span class="arrows">></span> Tailor your message for the proper network, don't just have content pushed or pasted from one social media platform to another. <i>Example: Don't use hashtags on Facebook, they aren't recognized.</i></li>
<li><span class="arrows">></span> To manage multiple accounts or have the ability to schedule posts and tweets, set up <a href="http://hootsuite.com/">Hootsuite</a> or <a href="http://measuredvoice.com/">MeasuredVoice</a> to manage multiple accounts.</li>
<li><span class="arrows">></span> Follow the prompts to add your social accounts.</li>
<li><span class="arrows">></span> You can manage up to five accounts at no cost.</li>
<li><span class="arrows">></span> You can schedule tweets and posts for later dates and times. To learn how to schedule them, read <a href="http://help.hootsuite.com/entries/240929-how-to-schedule-in-hootsuite">Hootsuite's guide</a>.</li>
</ul>
<h3 class="ribbon">Emergency Communications</h3>
<ul>
<li><span class="arrows">></span> Inform your community during emergencies or disasters through social media, as it is one of the quickest, easiest, most far-reaching channels available.</li>
<li><span class="arrows">></span> Be short, honest, and to the point.</li>
<li><span class="arrows">></span> Use the same format and framing across all networks to eliminate potential misunderstandings or confusion.</li>
</ul>
<h3 class="ribbon">Learning and Analytics</h3>
<ul>
<li><span class="arrows">></span> Use Facebook’s built-in analytics, accessible via the admin panel, to get a better idea about which content is driving traffic and shared most.</li>
<li><span class="arrows">></span> Make future decisions based on how the community is responding to and engaging with the content.</li>
<li><span class="arrows">></span> Google Analytics is a great tool to monitor data related to your social campaign.</li>
<li><span class="arrows">></span> If a more detailed aggregate for social analytics is needed, more information can be found <a href="http://www.meadigital.com/clickosity/2011/08/google-analytics-social-media-guide/">here</a>.</li>
</ul>
</div>
<div id="finish_line_cont"></div>
<p>Go forth and engage! Worry less about posting the wrong thing, and more about innovating! Some common sense, friendliness, and analytics go a long way. Experiment with new ideas like Tweetups. Reach out to people, own your social media, and make it yours.</p>
<p>Note: This handbook describes only the 4 most common social network platforms. There are several others you could look into for your city:
<ul>
<li><span class="arrows">></span> <a href="http://www.linkedin.com">LinkedIn</a>: If you want to attract potential job applicants, share the LinkedIn job posting across social networks.</li>
<li><span class="arrows">></span> <a href="http://www.tumblr.com">Tumblr</a>: Post text, photos, quotes, links, music, and videos on your Tumblr blog page.</li>
<li><span class="arrows">></span> <a href="http://www.pinterest.com">Pinterest</a>: Browse and share images, videos, and websites on pinboards with others who have similar interests.</li>
<li><span class="arrows">></span> <a href="http://www.vimeo.com">Vimeo</a>: If you want to upload, share, and view videos, Vimeo is a good alternative to YouTube.</li>
<li><span class="arrows">></span> <a href="https://plus.google.com">Google+</a>: If you want to use an amalgamation of several services, such as creating groups of followers to share updates with, you can look into Google+.</li>
</ul></p>
<p>A disclaimer: This handbook contains suggestions that are hopefully helpful, but if your city has a social media policy or guidelines, be sure to adhere to that first. </p>
</div>
<!--Sponsors-->
<div class="main_cont row" id="sponsors">
<div id="logo">
<a href="https://github.com/codeforamerica/social-media-handbook/#about" target="_blank"><img src="images/cfa.png" width="240" /></a>
</div>
</div>
<!-- Footer
================================================== -->
<footer class="footer">
<div id="footer_cont">
<a href="https://github.com/codeforamerica/social-media-handbook/#about"><img src="images/flag_tag.png"/></a>
</div>
</footer>
</div>
</div><!-- /container -->
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/bootstrap-transition.js"></script>
<script src="js/bootstrap-modal.js"></script>
<script src="js/bootstrap-scrollspy.js"></script>
<script src="js/application.js"></script>
<script src="js/bootstrap-tooltip.js"></script>
<script src="js/bootstrap-popover.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.2.js"></script>
<script type='text/javascript' src='js/jquery.scrollTo-1.4.2-min.js'></script>
<script type='text/javascript' src='js/jquery.localscroll-1.2.7-min.js'></script>
<script type='text/javascript' src='js/jquery.ba-hashchange.min.js'></script>
<script type='text/javascript' src='app.js'></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-20825280-1']);
_gaq.push(['_setDomainName', 'none']);
_gaq.push(['_setAllowLinker', true]);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<script type="text/javascript">
var _sf_async_config={uid:20661,domain:"codeforamerica.org"};
(function(){
function loadChartbeat() {
window._sf_endpt=(new Date()).getTime();
var e = document.createElement('script');
e.setAttribute('language', 'javascript');
e.setAttribute('type', 'text/javascript');
e.setAttribute('src',
(("https:" == document.location.protocol) ? "https://a248.e.akamai.net/chartbeat.download.akamai.com/102508/" : "http://static.chartbeat.com/") +
"js/chartbeat.js");
document.body.appendChild(e);
}
var oldonload = window.onload;
window.onload = (typeof window.onload != 'function') ?
loadChartbeat : function() { oldonload(); loadChartbeat(); };
})();
</script>
<div id="getsat-widget-784"></div>
<script type="text/javascript" src="https://loader.engage.gsfn.us/loader.js"></script>
<script type="text/javascript">
if (typeof GSFN !== "undefined") { GSFN.loadWidget(784,{"containerId":"getsat-widget-784"}); }
</script>
</body>
</html>