Guide to the MDN editor UI

The WYSIWYG (what-you-see-is-what-you-get) editor for the MDN Web Docs wiki makes it easy to contribute new content. This guide shows you how to use the editor and improve your productivity. Please read and comply with the Mozilla Terms before editing or creating new pages.

The MDN style guide offers information about how to format and style the content itself, including our preferred grammar and spelling rules.

Editor UI elements
The built-in WYSIWYG editor on MDN is designed to make it as easy as possible to create, edit, and improve articles and other pages almost anywhere on the site.
Images
It's frequently useful to include images in articles. Images may be screenshots, examples of what a rendering should look like, or SVG diagrams of program flow, for example. This article describes how to use images in MDN content.
Links
Links not only among many documents, but within a single document are a crucial component to any wiki, and MDN relies heavily on them. Fortunately, links are also very easy to create, even though there are lots of ways to make them!
Redirects
Sometimes you need to have a page that simply redirects to another page, or to a section of another page. This article describes how to create redirects.
Source mode
MDN's editor has a prominent button that gives you the ability to switch into source editing mode. In this mode, you see the underlying HTML for the body of the article you're editing. This guide will help you understand what you can do with this feature, what you should do with it, and, most importantly, what not to do.
Syntax highlighting
When you add a code example to an article on MDN, it's helpful to enable syntax highlighting, to make it easy for readers to visually pick out relevant bits of the code. Here's how to enable syntax highlighting in code examples:
Tables
Tables are a useful way to present information; this article covers how to create and maintain tables on MDN and when you should and should not use them.