Evangelism Reps Training Program/TechBloggingAtMozilla: Difference between revisions

Jump to navigation Jump to search
→‎Code examples: copyediting
(→‎Code examples: copyediting)
Line 77: Line 77:
==Code examples==
==Code examples==


Let's talk about the thing that really makes a blog post a technical blog post - code examples. For detailed information about code examples and why they should be the best code you ever write you can [http://developer-evangelism.com/code.php check the Developer Evangelism Handbook entry on code examples], but here are a few very important points:
Let's talk about the thing that really makes a blog post a technical blog post: code examples. For detailed information about code examples and why they should be the best code you ever write you can [http://developer-evangelism.com/code.php check the Developer Evangelism Handbook entry on code examples], but here are a few very important points:


*'''Link the original source''' - preferably on GitHub, also a working example or at least as a zip. People should never have to copy and paste code to make it work.  
*'''Link the original source''' — preferably on GitHub, also a working example or at least as a zip. People should never have to copy and paste code to make it work.  
*'''Embed readable code''' - there are a few options:
*'''Embed readable code''' — there are a few options:
**'''Use colour coding''' - our blog allows you to do that by adding <pre lang="$lang"> around your code where $lang can be xml (for HTML), javascript or css (and a few others).  
**'''Use colour coding''' — the Hacks blog allows you to do that by adding <pre lang="$lang"> around your code where $lang can be xml (for HTML), javascript or css (and a few others).  
**'''Embed a Gist from GitHub''' - this has the benefit of your code being editable if needed. However, in most cases a change in code would also have to reflect in the text.
**'''Embed a Gist from GitHub''' — this has the benefit of your code being editable if needed. However, in most cases, a change in code would also have to be reflected in the text.
**'''Embed an interactive code example''' - using [http://jsfiddle.net JSFiddle], [http://jsbin.com JSBin.com], [http://tinker.io Tinker.io], [http://dabblet.com/ Dabblet] or others. This is very cool as people can play with the code, but you are also dependent on these services to be up and running. The iframe embedding also doesn't work on RSS readers, so make sure to link the URL and do the embedding - much like you do with multimedia.
**'''Embed an interactive code example''' — using [http://jsfiddle.net JSFiddle], [http://jsbin.com JSBin.com], [http://tinker.io Tinker.io], [http://dabblet.com/ Dabblet] or others. This is very cool, as people can play with the code, but you are also dependent on these services to be up and running. The iframe embedding also doesn't work on RSS readers, so make sure to link the URL and do the embedding, much like you do with multimedia. Be aware that posting an iframe in WordPress typically requires administrator privileges.
*'''Make your code work''' - as explained on the Evangelism handbook, your code '''must''' work. Write very paranoid and defensive code as your example. It is very tempting to show the shortest code possible but we want to teach people good code, not how to cut corners.
*'''Make your code work''' — as explained in the Evangelism handbook, your code '''must''' work. Write very paranoid and defensive code as your example. It is very tempting to show the shortest code possible, but we want to teach people good code, not how to cut corners.
*'''Write code for the web''' - our code examples should be code that works regardless of your browser. This is not always possible, but when it is make sure to always check for the support of technology before applying it. When it comes to browser-specific code also include vendor prefixes of other browsers and a prefix-less fallback. If a Chrome user sees an effect created with our code he is a happy reader and will promote our post. We should never force people to use what we prefer as our environment. This is what bad marketing sites do - we are not that.
*'''Write code for the web''' — our code examples should be code that works regardless of the reader's browser. This is not always possible, but when it is make sure to always check for the support of technology before applying it. When it comes to browser-specific code, also include vendor prefixes of other browsers and a prefix-less fallback. If a Chrome user sees an effect created with our code, he is a happy reader and will promote our post. We should never force people to use what we prefer as our environment. This is what bad marketing sites do — we are not that.


==Cross-posting and promotion==
==Cross-posting and promotion==
canmove, Confirmed users
1,953

edits

Navigation menu