Page structures

Throughout MDN there are document structures that are used to provide consistent presentation of information in MDN articles. This page lists articles describing these structures so that you can modify page content appropriately for the documents you write, edit, or translate.

Banners and notices: Banners and notices are displayed in some pages, in particular API reference, in order to highlight important factors that will affect how the described content is used. For example, banners are used to highlight when a particular interface, method or property is deprecated, and should not be used in production code, or can only be used in a secure context.
Code examples: On MDN, you'll see numerous code examples inserted throughout the pages to demonstrate usage of web platform features. This article discusses the different mechanisms available for adding code examples to pages, along with which ones you should use and when.
Compatibility tables and the browser compatibility data repository (BCD): MDN has a standard format for tables that illustrate compatibility of shared technologies across all browsers, such as DOM, HTML, CSS, JavaScript, SVG, etc. To make this data available in multiple projects programmatically, a Node.js package is built from the browser-compat-data repository and published to npm.
Feature status: A feature status provides developers with information about the implementation stage of the feature among browser vendors and is one of the following:
Link macros: MDN provides numerous macros to create always up-to-date links to MDN content. In this guide, you will learn about MDN cross-reference macros that you can use to include a single link to another page or a list of links to all of a document's subpages.
Live examples: MDN supports displaying code blocks within the articles as live samples, enabling readers to see both the code and its output as it would look on a web page. This feature allows readers to understand exactly what the executed code would produce, making the documentation dynamic and instructive. It also allows authors to be absolutely sure that the code blocks in documentation have the expected output, and work appropriately when used with different browsers.
Page types: There are a number of types of pages that are used repeatedly on MDN. This article describes these page types, their purpose, and gives examples of each and templates to use when creating a new page.
Sidebars: MDN pages all include sidebars. Most of them are created using a standard system that defines data structures in YAML files, and includes sidebars on pages using macro calls.
Specification tables: Every reference page on MDN should provide information about the specification or specifications in which that API or technology was defined. This article demonstrates what these tables look like and explains how to add them.
Syntax sections: The syntax section of an MDN reference page contains a syntax box defining the exact syntax that a feature has (e.g. what parameters can it accept, which ones are optional?) This article explains how to write syntax boxes for reference articles.
Using macros: The Yari platform on which MDN runs provides a macro system, KumaScript, which makes it possible to automate certain tasks. This article provides information on how to invoke MDN's macros within articles.