mdn development & web documentation

47

Upload: jay-patel

Post on 29-Jan-2015

115 views

Category:

Technology


4 download

DESCRIPTION

Session at Mozilla Camp Europe 2011 in Berlin, Germany by Jay Patel & Jean-Yves Perrier about our work on the Mozilla Developer Network (MDN). Jay covers the evolution of MDN as a platform for developer engagement and Jean-Yves discusses our Web documentation efforts.

TRANSCRIPT

Page 1: MDN Development & Web Documentation
Page 2: MDN Development & Web Documentation

MDN Development &

Web Documentation

Jay [email protected]@jaybhai

Jean-Yves Perrier @teoli2003

Page 3: MDN Development & Web Documentation

Agenda

What will we cover?

•Branding

•Evolution of MDN

•Kuma Project

•Developer Engagement Platform

•Development

•Documentation

Page 4: MDN Development & Web Documentation

The many names for

developer.mozilla.org

DevMo

MDC

MDN

#devmo IRC channel(historical short name for domain)

MDN Documentation Center(docs section of MDN)

Mozilla Developer Network(website, community, campaigns, etc.)

Page 5: MDN Development & Web Documentation

Evolution of

MDN

Page 6: MDN Development & Web Documentation

•Build platform for developer engagement

•Leverage Django code from SUMO (Kitsune)

• Improve documentation and editorial processes

•Fix the l10n experience for localizers

•Add social features and collaboration tools

•Grow new areas for demos, events, learning, and community

Goals for the

Kuma Project

Page 7: MDN Development & Web Documentation

Platform for

Developer Engagement

Page 8: MDN Development & Web Documentation

Agile process for

Kuma Development

2 week “sprints”• MDN dev team includes 3 dev + 1 qa + 1 doc + 1 pm• Weekly bug triage and planning meeting• 20-25 “points” per sprint• 10 days dev + 5 days QA

Bugs / Backlog in Bugzilla• Product: Mozilla Developer Network• Component: Website

Feedback / Feature Requests with UserVoice• http://mdn.uservoice.com

/forums/51389-mdn-website-feedback-http-developer-mozilla-org

Learn more about our process• http://groovecoder.com/2011/07/18/bugzilla-agile/• http://groovecoder.com/2011/11/09/mdn-agile-status/

Page 9: MDN Development & Web Documentation

Tracking Kuma development with

BugzillaJS

Page 10: MDN Development & Web Documentation

Progress update and next steps for

Kuma Roadmap

2010• Django front-end + infrastructure

2011• Q1: Demo Studio + Start Wiki• Q2: MDN Learning + Dev Derby• Q3: Where is Mozilla? + MDN Profiles• Q4: Finish Wiki + Apps + Discussions

2012• Q1: Docs Migration + Start l10n + Kuma Beta• Q2: Finish l10n + Kuma Launch• Q3: Continue to evolve based on feedback

Page 11: MDN Development & Web Documentation

General Info: https://wiki.mozilla.org/MDN

Kuma Project Info:https://wiki.mozilla.org/MDN/Kuma

Kuma Milestones: https://wiki.mozilla.org/MDN/Milestones

Mailing list: https://lists.mozilla.org/listinfo/dev-mdn

IRC: #mdn on irc.mozilla.org

Learn more, stay connected, and

Join Us!

Page 12: MDN Development & Web Documentation

Jay PatelProduct Manager,

MDN

[email protected]@jaybhai

jay on IRC

It’s time for me to stop talking…

Thanks!

Jean-Yves is up next…

Page 13: MDN Development & Web Documentation

HTML, CSS, JS, HTTP, SSL...

Learning the web is as complex as learning a human

language...

Page 14: MDN Development & Web Documentation

<article><input type= "email">

<bdi>

<audio>

<video><!DOCTYPE html>

The web is evolving faster and faster...

tab-size :linear-gradient()

transform :backface-visibility :

@font-face

hsla()

Page 15: MDN Development & Web Documentation

The web is heterogenous,

moving at different paces,

and new actors are coming.

Page 16: MDN Development & Web Documentation

And what do we have ?Lot of outdated or

poor documentation.

There is good info,but buried and

scattered.

The non-specialistdoesn't recognize it,

if it find it.

And the spec is precisebut different from

the reality...

Page 17: MDN Development & Web Documentation

For the Open Web

We need a documentation :

•Up-to-date

•Browser agnostic

•Complete

•Practical

•with examples

•with good practices

•with bad practices debunked

We need to know :

•Spec status

•Current implementation

•Answer to practicalcases

Page 18: MDN Development & Web Documentation

But...

there are more than the Open Web at

Mozilla

Page 19: MDN Development & Web Documentation

<XUL>

Gecko

Page 20: MDN Development & Web Documentation

For Mozilla StuffWe need a

documentation :

•Up-to-date

•Browser agnostic

•Complete

•Practical

•with examples

•with good practices

•with bad practices debunked

We need to know :

•What's going on...

•How it works...

Page 21: MDN Development & Web Documentation

Port

al Pa

ge (

Lan

din

g P

ag

e) Index

Reference Pages

Concept Pages ("Using XYZ…") Tutorials

Articles Demos

Typical Doc Structure

Page 22: MDN Development & Web Documentation

CSS landing page

Page 23: MDN Development & Web Documentation

CSS index

Page 24: MDN Development & Web Documentation
Page 25: MDN Development & Web Documentation
Page 26: MDN Development & Web Documentation
Page 27: MDN Development & Web Documentation

MDN is an integrated Mozilla product

Page 28: MDN Development & Web Documentation

How to help ?

Page 29: MDN Development & Web Documentation

Fix a typoAdd an example

Add an internal link

Add a link from a blogTell about it

Fix compatibility info

Write a missing article

Complete an article

Correct an error Use it

Page 30: MDN Development & Web Documentation

Create an account

Page 31: MDN Development & Web Documentation
Page 32: MDN Development & Web Documentation

And that's it. Welcome new MDN editor !

Page 33: MDN Development & Web Documentation

A simple editing session

Page 34: MDN Development & Web Documentation
Page 35: MDN Development & Web Documentation
Page 36: MDN Development & Web Documentation
Page 37: MDN Development & Web Documentation

To be a better editor...

Write sentences, not lists (SEO).

Be precise : a CSS at-rule is not a CSS property

Page 38: MDN Development & Web Documentation

To be a better editor...

Link, link, link ! Internally or externally.

Navigability is the key to find quickly the right information.

Page 39: MDN Development & Web Documentation

Christmas Tree effect

Page 40: MDN Development & Web Documentation

To be a better editor...

•Cite sources (the '#' shortcut)

# will becomes [1], [2], ...

•Respect copyrights.

Page 41: MDN Development & Web Documentation

Do not be afraid, but...•Do not move pages around without knowing what

you are doing.

•Put a comment when editing!

Page 42: MDN Development & Web Documentation

Future challenges

•Increase quality of content and form.

•Keep up-to-date with new spec (CSS4, DOM4).

•Keep up with the 6-weeks release schedule.

•Live examples.

•Screencasts.

•L10n.

•KUMA migration.

Page 43: MDN Development & Web Documentation

Getting help

•Mozilla IRC : #devmo channel

•Newsgroup : mozilla.dev.mdc

Bi-monthly community meeting on IRC,

(announced on mozilla.dev.mdc)

•Twitter @teoli2003

Page 44: MDN Development & Web Documentation

Doc Sprints

3-4 times a year, a few Mozillians meet during a week-end.

Next early 2012, info will be posted on

http://hacks.mozilla.org and on mozilla.dev.mdc

Page 45: MDN Development & Web Documentation

In conclusion,

•Mozilla choosed the Open Web as one of the worthy battles to fight, the MDN is one of the weapon for this one.

•Almost anybody can help.

Page 46: MDN Development & Web Documentation

Q&A

Page 47: MDN Development & Web Documentation

MDN Production:http://developer.mozilla.org/

Kuma Staging Server:https://kuma-stage.mozilla.org/en-US/