Evangelism Reps Training Program/TechBloggingAtMozilla: Difference between revisions

Jump to navigation Jump to search

Evangelism Reps Training Program/TechBloggingAtMozilla (view source)

Revision as of 16:23, 9 April 2012

3,580 bytes added ,  9 April 2012
no edit summary
No edit summary
No edit summary
Line 35: Line 35:


*'''Use proper headings''' - h2 - h6 elements are powerful (h1 is normally already taken by the title of the post) as they give the eye something to rest, show the reader that they won't be overwhelmed with a long piece of text and they even aid accessibility. Users of screen readers can skip from heading to heading instead of having to listen to all you wrote. Search engines also love headings so make sure you put sentences in there that make sense out of context.
*'''Use proper headings''' - h2 - h6 elements are powerful (h1 is normally already taken by the title of the post) as they give the eye something to rest, show the reader that they won't be overwhelmed with a long piece of text and they even aid accessibility. Users of screen readers can skip from heading to heading instead of having to listen to all you wrote. Search engines also love headings so make sure you put sentences in there that make sense out of context.
*'''Tell your story''' - but not like you'd do in a presentation. Start with the climax (what you want to show), follow with the explanation of how it works, continue with where it might fail and what to do about that and end with "and one more thing" (other resources).
*'''Use lists''' - bullet-point lists, whilst horrible in presentations make a lot of sense to make a lot of information easier to digest in posts. As you can see here another extra would be to have a bold first statement followed by a dash to give your item even more structure. Do not use numbered lists unless the order of execution of the list item matters.  
*'''Use lists''' - bullet-point lists, whilst horrible in presentations make a lot of sense to make a lot of information easier to digest in posts. As you can see here another extra would be to have a bold first statement followed by a dash to give your item even more structure. Do not use numbered lists unless the order of execution of the list item matters.  
*'''Give away everything at the beginning''' - start with what you will talk about and show how it works. This could be a linked example, a screencast, a screenshot - anything to get people going. Link to the source so people can download for later use whilst reading. Avoid the "where do I get this" comments. In news journalism this is the "What, where when" that every first sentence of a piece of news should answer.
*'''Give away everything at the beginning''' - start with what you will talk about and show how it works. This could be a linked example, a screencast, a screenshot - anything to get people going. Link to the source so people can download for later use whilst reading. Avoid the "where do I get this" comments. In news journalism this is the "What, where when" that every first sentence of a piece of news should answer.
Line 47: Line 48:
*'''Links are proof, not context''' - external links are there to give your argument more weight. Think of wikipedia's citation rules. Do not expect the reader to follow any link you add to understand your post. Instead, explain and link to the external resource for proof.  
*'''Links are proof, not context''' - external links are there to give your argument more weight. Think of wikipedia's citation rules. Do not expect the reader to follow any link you add to understand your post. Instead, explain and link to the external resource for proof.  
*'''Know your link targets''' - to be safe, when it comes to technical information, link to the wiki. If you link to a third party page you can not control if it will be there in the future. Of course if there is a better third party info link it, but be wary of what it is. By linking to a resource you give it credibility - make sure it is worth it. A bad link promoted by you tarnishes your reputation.
*'''Know your link targets''' - to be safe, when it comes to technical information, link to the wiki. If you link to a third party page you can not control if it will be there in the future. Of course if there is a better third party info link it, but be wary of what it is. By linking to a resource you give it credibility - make sure it is worth it. A bad link promoted by you tarnishes your reputation.
*'''Provide "read more" resources''' - at the end of the article list a few things that can give more information about the theme of your post - it promotes literacy and gets people excited about learning more.
*'''Test your links''' - broken links are broken promises. Also check your targets - no point to send users to the top of the page when you want a quote in the middle of it.
*'''Test your links''' - broken links are broken promises. Also check your targets - no point to send users to the top of the page when you want a quote in the middle of it.
*'''Provide "read more" resources''' - at the end of the article list a few things that can give more information about the theme of your post. This allows you to promote the wiki, other resources and also invites readers to learn what other people have to say about the topic. You are not only the expert writing this post but it also shows that you did your homework.


==Images==
==Images==


In traditional blogging people will always tell you there needs to be an image in your post to catch people's attention. That works in tech blogging, too, but is not a need-to-have. That said, however images are very powerful when you want to show something that might not be possible in the browser people use to read your blog. It is a great "this is what it should look like". For using images there are a few tips:
In traditional blogging people will always tell you there needs to be an image in your post to catch people's attention. That works in tech blogging, too, but is not a need-to-have. That said, however images are very powerful when you want to show something that might not be possible in the browser people use to read your blog. It is a great "this is what it should look like". For using images there are a few tips:
*'''Link to the resource''' - if you use the in-built WordPress image uploader the image will be linked to the full-size version of the image. If that is wanted, fine. However it makes more sense to link a screenshot to the real resource on the web - people click those much more than text links. Make sure your original images are crisp and big enough to avoid having to link to a "full size" version.
*'''Use absolute image paths''' - your image src should always be a full http URL. The reason is that RSS readers will then display them.
*'''Have a sensible alternative text''' - this is good for search engines and for accessibility. If the image could not be loaded for any reason you'd still provide the information. Notice that alt="" is not at all the same as title="". It is tempting to give a good title attribute to an image as that is what people see when they hover the image but the alternative content is where your texting skills should go. Titles are nice-to-haves but in most cases not needed at all.
*'''Crop what is not needed''' - there is no point in posting full-screen 1440 pixel images when all you want to show is a form element. Crop your images down to the most needed part. You want to explain with those, not make people have to find things.
*'''Play nice with people's bandwidth''' - people will read our blog on the go, so make sure to optimise the images to the lowest file size possible without making them blurry.
==Multimedia (Screencasts, Audio)==
When an image is not enough, the output is audial or you want to show interaction then you'll need to provide the reader with multimedia. You can follow a few simple tips there to avoid confusion.
*'''Provide a fallback link''' - a lot of RSS readers will filter out multimedia content. If you talk about a video in your post that is not visible this will confuse people. Therefore it makes sense to add a sentence before embedding the video to link to the resource on the web. Like "Check out this example in action." with "this example" being liked to the YouTube video you embed following the sentence. That way it makes sense for those who can see the video (and open/bookmark the video for later using the link) and those who haven't got video. The same applies to using an HTML5 video element. As the last fallback inside the element provide a link to the video, telling the user the format and size - like "Video recording of Chris talking on HTML5 at MDN hack day in NYC - 23MB - MP4".
*'''Keep them snappy''' - if you just want to show a quick demo, have just that demo without any voice-over. This is to show what things look like, not to replace the post.
*'''Cross-link from the video site''' - if you use YouTube to host your video, give the video a good title and description there and make sure to link to your post. A lot of traffic can come from there as people are very likely to share the video on Facebook, Twitter and Google+ and they might forget to link the original post.
There is more information on [https://wiki.mozilla.org/Evangelism_Reps_Training_Program/How_to_prepare_a_screencast creating screencasts] available here.
=====
Cheilmann
Confirmed users
376

edits

Retrieved from "https://wiki.mozilla.org/Special:MobileDiff/418019"

Navigation menu