aboutsummaryrefslogtreecommitdiff
path: root/files/es/mdn/contribute/howto
diff options
context:
space:
mode:
Diffstat (limited to 'files/es/mdn/contribute/howto')
-rw-r--r--files/es/mdn/contribute/howto/convert_code_samples_to_be_live/index.html44
-rw-r--r--files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html32
-rw-r--r--files/es/mdn/contribute/howto/document_a_css_property/index.html82
-rw-r--r--files/es/mdn/contribute/howto/document_a_css_property/plantilla_propiedad/index.html120
-rw-r--r--files/es/mdn/contribute/howto/enlace_cuenta_github/index.html110
-rw-r--r--files/es/mdn/contribute/howto/etiquetas_paginas_javascript/index.html83
-rw-r--r--files/es/mdn/contribute/howto/index.html15
-rw-r--r--files/es/mdn/contribute/howto/remover_macros_experimentales/index.html48
-rw-r--r--files/es/mdn/contribute/howto/revision_editorial/index.html54
-rw-r--r--files/es/mdn/contribute/howto/revision_tecnica/index.html44
-rw-r--r--files/es/mdn/contribute/howto/set_the_summary_for_a_page/index.html118
-rw-r--r--files/es/mdn/contribute/howto/tag/index.html385
-rw-r--r--files/es/mdn/contribute/howto/usar_barras_laterales_de_navegación/index.html78
-rw-r--r--files/es/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html72
-rw-r--r--files/es/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html106
15 files changed, 1391 insertions, 0 deletions
diff --git a/files/es/mdn/contribute/howto/convert_code_samples_to_be_live/index.html b/files/es/mdn/contribute/howto/convert_code_samples_to_be_live/index.html
new file mode 100644
index 0000000000..699828214a
--- /dev/null
+++ b/files/es/mdn/contribute/howto/convert_code_samples_to_be_live/index.html
@@ -0,0 +1,44 @@
+---
+title: Cómo convertir códigos de demostración para que estén "en vivo"
+slug: MDN/Contribute/Howto/Convert_code_samples_to_be_live
+tags:
+ - Código
+ - Demostración
+ - Sample
+translation_of: MDN/Contribute/Howto/Convert_code_samples_to_be_live
+---
+<div>{{MDNSidebar}}</div><p class="summary">MDN tiene ahora un sistema de "ejemplos en vivo", donde el código de demostración que aparece en la página se usa directamente para mostrar el resultado de dicho ejemplo. Sin embargo, muchos artículos existentes tienen ejemplos que todavía no usan este sistema y necesitan ser convertidos.</p>
+
+<table class="full-width-table">
+ <tbody>
+ <tr>
+ <td><strong>¿Dónde hay que hacerlo?</strong></td>
+ <td>En artículos etiquetados como <a href="/en-US/docs/tag/NeedsLiveSample">NecesitaMuestraEnVivo</a><span style="line-height: 1.5;"> (</span><a style="line-height: 1.5;" href="/en-US/docs/tag/NeedsLiveSample">NeedsLiveSample</a>)</td>
+ </tr>
+ <tr>
+ <td><strong>¿Qué necesitas saber para hacer esta tarea?</strong></td>
+ <td>
+ <ul>
+ <li>Entender HTML, CSS y/o JavaScript, dependiendo del código de muestra que sea.</li>
+ <li>Habilidad para usar macros <a href="https://developer.mozilla.org/es/docs/Project:MDN/Kuma/Introduction_to_KumaScript">KumaScript</a> dentro de los artículos MDN.</li>
+ </ul>
+ </td>
+ </tr>
+ <tr>
+ <td><strong>¿Cuáles son los pasos para hacer la tarea?</strong></td>
+ <td>
+ <p>Para una descripción completa del sistema de demostración en vivo, incluyendo cómo crear las demostraciones en vivo, ver <a href="/en-US/docs/Project:MDN/Contributing/Editor_guide/Live_samples">Usar el sistema de demostración en vivo</a>.</p>
+
+ <ol>
+ <li>Elige un artículo de la lista de artículos etiquetados como <a style="text-decoration: underline;" href="/en-US/docs/tag/NeedsLiveSample">NecesitaMuestraEnVivo</a> (<a href="/en-US/docs/tag/NeedsLiveSample">NeedsLiveSample</a>), donde el código sea para una característica con la que sientas que estas familiarizado.</li>
+ <li>Convierte el código para que sea "en vivo".</li>
+ <li>Borra cualquier código o imagen que haya sido usada para mostrar el resultado de la demostración.</li>
+ </ol>
+
+ <p> </p>
+ </td>
+ </tr>
+ </tbody>
+</table>
+
+<p> </p>
diff --git a/files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html b/files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html
new file mode 100644
index 0000000000..8e254f6ac0
--- /dev/null
+++ b/files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html
@@ -0,0 +1,32 @@
+---
+title: Cómo crear una cuenta MDN
+slug: MDN/Contribute/Howto/Crear_cuenta_MDN
+tags:
+ - Cuenta
+ - GitHub
+ - Perfil
+ - Persona
+ - Principiante
+ - account
+translation_of: MDN/Contribute/Howto/Create_an_MDN_account
+---
+<div>{{MDNSidebar}}</div>
+
+<p>Para editar contenido en MDN, necesitas un perfil MDN. No es necesario un perfil si solo quieres buscar y leer los documentos de MDN:</p>
+
+<ol>
+ <li>En la parte superior de cada página en MDN encontrarás el botón de  <strong>Registrarse</strong>. Pasa el puntero del mouse por ahí (o toca sobre este botón si estás con un dispositivo móvil) para mostrar una lista de servicios de autenticación que son permitidos para registrarse en MDN.</li>
+ <li>Selecciona el servicio para registrarte. Actualmente, solo GitHub y Gmail están disponibles. Ten en cuenta que si seleccionas GitHub, un enlace a tu perfil de GitHub será incluido en tu página de perfil público de MDN.</li>
+ <li><span id="result_box" lang="es"><span>Sigue las indicaciones de GitHub o de Gmail para conectar tu cuenta a MDN.</span></span></li>
+ <li><span lang="es"><span>Una vez autenticado el servicio te retorna a MDN, se te pedirá que ingreses un nombre de usuario y una dirección de correo electrónico. <em>Tu nombre de usuario será mostrado públicamente para darte el crédito del trabajo que has hecho. No utilices tu dirección de correo electrónico como nombre de usuario. </em></span></span></li>
+ <li>Click en <strong>Crear mi perfil MDN.</strong></li>
+ <li>Si la dirección de correo electrónico que has especificado en el paso 4 no es el mismo que has utilizado  con el servicio de autenticación, revisa tu correo y dale click en el enlace en el correo de confirmación que se te envió.</li>
+</ol>
+
+<p>¡Listo! <span id="result_box" lang="es"><span>¡Ya tienes una cuenta MDN y puedes editar páginas inmediatamente!</span></span></p>
+
+<p><span lang="es"><span>Puedes dar clic en tu nombre en la parte superior de cualquier página de MDN para ver tu perfil público. Desde ahí, puedes editar, hacer cambios o adicionar información en tu perfil.</span></span></p>
+
+<div class="note">
+<p><strong>Nota:</strong> Los nuevos nombres de usuario no pueden contener espacios ni el carácter "@". Ten en cuenta que tu nombre de usuario será mostrado públicamente para identificar los trabajos que hayas hecho!</p>
+</div>
diff --git a/files/es/mdn/contribute/howto/document_a_css_property/index.html b/files/es/mdn/contribute/howto/document_a_css_property/index.html
new file mode 100644
index 0000000000..41b3fcb14f
--- /dev/null
+++ b/files/es/mdn/contribute/howto/document_a_css_property/index.html
@@ -0,0 +1,82 @@
+---
+title: Cómo documentar una propiedad CSS
+slug: MDN/Contribute/Howto/Document_a_CSS_property
+translation_of: MDN/Contribute/Howto/Document_a_CSS_property
+---
+<div>{{MDNSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/MDN")}}</div>
+
+<p>As the <a href="/en-US/docs/Web/CSS">CSS</a> standards evolve, new properties are always being added. The MDN <a href="/en-US/docs/Web/CSS/Reference">CSS Reference</a> needs to be kept up to date with these developments. This document gives step-by-step instructions for creating a CSS property reference page.</p>
+
+<p>Each CSS property reference page follows the same structure. This helps readers find information more easily, especially once they are familiar with the standard reference page format.</p>
+
+<h2 id="Step_1_—_Decide_which_property_to_document">Step 1 — Decide which property to document</h2>
+
+<p>First, you will need to decide which property to document. The <em>CSS Documentation status</em> page lists properties that <a href="/en-US/docs/Web/CSS/Documentation_status#Missing_pages">need to be documented</a>. For details about the CSS property you will need to find a relevant specification for it (e.g., a <a href="http://www.w3.org/Style/CSS/">W3C specification</a>, a <a href="https://wiki.mozilla.org">Mozilla Wiki page</a>, or a bug report for a non-standard property used in rendering engines like Gecko or Blink).</p>
+
+<div class="note">
+<p><strong>Pro tips:</strong></p>
+
+<ul>
+ <li>When using a W3C spec, always use the <strong>Editor's Draft</strong> (note the red banner on the left side) and not a published version (e.g. Working Draft). The Editor's Draft is always closer to the final version!</li>
+ <li>If the implementation and spec diverge, feel free to mention it in the implementation bug: it may be a bug in the implementation (and a follow-up bug will be filed), a delay in the publication of a new spec, or an error in the spec (in which case a spec bug is worth filing).</li>
+</ul>
+</div>
+
+<h2 id="Step_2_—_Check_the_database_of_CSS_properties">Step 2 — Check the database of CSS properties</h2>
+
+<p>Several characteristics of a CSS property, such as its syntax or if it can be animated, are mentioned in several pages and are therefore stored in an ad-hoc database. Macros that you'll use on the page need information about the property that is stored there, so start by <a href="/en-US/docs/MDN/Contribute/Howto/Update_the_CSS_JSON_DB">checking that this information is there</a>.</p>
+
+<p>If not, contact an admin or a power user, either on the <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">MDN Web Docs chat room</a>, or, if nobody is available, by <a href="https://github.com/mdn/sprints/issues/new?template=issue-template.md">filing an issue report</a>.</p>
+
+<h2 id="Step_3_—_Creating_the_CSS_property_page">Step 3 — Creating the CSS property page</h2>
+
+<p>Preparations finished! Now we can add the actual CSS property page. The easiest way to create a new CSS property page is to copy the content of an existing page and to edit it. We will go through the different steps now.</p>
+
+<div class="note">
+<p>Cloning a page is currently broken on MDN. That's why we need to go through these somewhat more complex steps. Please vote for ({{bug(870691)}}).</p>
+</div>
+
+<ol>
+ <li>Clone the <a href="/en-US/docs/MDN/Contribute/Howto/Document_a_CSS_property/Property_template">following page</a>, set the title to <em>your-property</em> (without capitals) and the slug to <code>Web/CSS/<em>your-property</em></code><em>.</em></li>
+ <li>Change the summary to fit, but keep it starting the same way : "The <em><code>your-property</code></em> <a href="/en-US/docs/Web/CSS">CSS</a> property…". Explain briefly what this property is for.</li>
+ <li>If the property is not experimental, remove the <code>\{{SeeCompatTable}}</code> macro. The purpose of this macro is to alert developers to the possibility that the feature may not yet have consistent support across browsers, and may change in the future as its specificaton evolves. Deciding whether a feature is experimental is a matter of judgement, and should include factors like:
+ <ul>
+ <li>Is the feature supported by several browsers?</li>
+ <li>Is the feature prefixed or behind a preference?</li>
+ <li>Is there any reason to think that the implementation of the feature will change in the future?</li>
+ </ul>
+ </li>
+ <li>Replace the parameter of the <code>\{{cssinfo("animation-name")}}</code> macro by the name of the CSS property you are documenting. This will allow you to build the summary box using the data you entered in step 2.</li>
+ <li>Replace the example of the syntax by relevant ones. Keep them very simple and don't forget that a lot of people don't understand a formal syntax so it needs to be simple and exhaustive. Keep the <code>inherit</code>, <code>initial</code>, and <code>unset</code> keywords examples at the end. It reminds users that these are valid values, too.</li>
+ <li>Under the chapter <em>Values</em>, put the meaning of each value. If it is a keyword, don't forget to mark it as code (select it and press <code>CTRL-O</code>). Each description should start by "Is a" followed by the type of the value, or indicating it is a keyword.</li>
+ <li>Clear the <em>Examples</em> chapter, we will add them at the end!</li>
+ <li>Update the specification table. For information about how to do it, read this <a href="/en-US/docs/MDN/Contribute/Structures/Specification_tables">tutorial</a>.</li>
+ <li>Update the compatibility information. For information about how to do it, read this <a href="/en-US/docs/MDN/Contribute/Structures/Compatibility_tables">tutorial</a>.</li>
+ <li>Update the <em>See also</em> section with relevant links. Do not link to specs here and usually link to internal documents. External documents are welcome, but only if they bring really good information. There are spam or SEO links often, so don't worry if external links are removed sometimes. Just start the discussion if you still find it useful and want to see it back.</li>
+ <li>Add the relevant tags: you need to add <code>CSS</code>, <code>CSS Property</code>, and <code>Reference.</code> You also need to add <code>Experimental</code> or <code>Non-standard</code> if this is the case. Finally you also need to add a <code>CSS XYZ</code> tag, where XYZ stands for the group of CSS properties it belongs to. It is often the spec short name. All these tags are used to generate quicklinks and other niceties.</li>
+</ol>
+
+<p>At any point, you can save by hitting the <code>SAVE</code> button. You can continue to edit right along. If you haven't saved your page until now, please do so! :-)</p>
+
+<p>The last step is to add <em>Examples</em>. To do that follow this <a href="/en-US/docs/Project:MDN/Contributing/Editor_guide/Live_samples">tutorial about live samples</a>. Don't forget that we are in a document explaining one single property: you need to add examples that show how this property is working in isolation, not how the whole specification is used. That means, examples for <code>list-style-type</code> will show what the different values generate, but not how to combine it with other property, pseudo-classes or pseudo-elements to generate nice effects; tutorials and guide can be written to show more.</p>
+
+<h2 id="Step_4_—_Getting_a_review">Step 4 — Getting a review</h2>
+
+<p>You have documented your CSS property! Congratulations!</p>
+
+<p>In order to have a good quality and consistency throughout the MDN CSS reference, it is good practice to request a review. Just click on the checkbox at the bottom of the article (in edit mode), and, optional, if you want to have a more personal review helping you to improve editorial skills, ask for it on the <a href="https://discourse.mozilla-community.org/c/mdn">MDN forum</a>.</p>
+
+<h2 id="Step_5_—_Integrating_the_new_page_in_the_MDN">Step 5 — Integrating the new page in the MDN</h2>
+
+<p>Now that your page is created, you want it to be found by the readers. Adding tags helped about this already as it allowed it to appear in the quicklinks to related CSS pages. Also you want it to appear on the <a href="/en-US/docs/Web/CSS/Reference">CSS index page</a>. If the newly documented property is on the standard track and at least one major browser is implementing it, it deserves to be listed this. Only administrator can add it there, so contact the CSS driver on IRC (currently at #mdn ping teoli) or file a documentation bug requesting it.</p>
+
+<p>Also, if the property is implemented by Firefox, you need to check that it is listed, and linked! in the correct <a href="/en-US/Firefox/Releases">Firefox for developers</a> MDN page. The new CSS property is likely already listed in the HTML section, just be sure that its name links back to your newly created page.</p>
+
+<h2 id="Contact_us">Contact us</h2>
+
+<ul>
+ <li>On IRC: <a href="irc://irc.mozilla.org/mdn">#mdn</a></li>
+ <li><a href="https://discourse.mozilla.org/c/mdn">Discourse</a></li>
+</ul>
diff --git a/files/es/mdn/contribute/howto/document_a_css_property/plantilla_propiedad/index.html b/files/es/mdn/contribute/howto/document_a_css_property/plantilla_propiedad/index.html
new file mode 100644
index 0000000000..a0bdd5267f
--- /dev/null
+++ b/files/es/mdn/contribute/howto/document_a_css_property/plantilla_propiedad/index.html
@@ -0,0 +1,120 @@
+---
+title: Plantilla de página para propiedades CSS
+slug: MDN/Contribute/Howto/Document_a_CSS_property/Plantilla_propiedad
+translation_of: MDN/Contribute/Howto/Document_a_CSS_property/Property_template
+---
+<div>{{MDNSidebar}}</div><div class="note">Esta es una página plantilla para las propiedades de CSS. Por favor utilice esto como una plantilla base cuando vaya a crear una nueva página para una propiedad de CSS. <br>
+<em>Los comentarios en cursiva son información  sobre cómo usar parte de la plantilla</em></div>
+
+<div>{{CSSRef}}</div>
+
+<div><em>Agregue el encabezado no estándar si la propiedad no esta en el estándar. En la sección de resumen en una nota, describa como lograr su efecto usando tecnologías estándares de la Open Web.</em></div>
+
+<div>{{non-standard_header}}</div>
+
+<div> </div>
+
+<div><em>Agregue el encabezado experimental si a su juicio es probable que el comportamiento de la propiedad cambie en el fututo, por ejemplo; debido a especificaciones muy inmaduras o implementaciones incompatibles.</em></div>
+
+<div>{{SeeCompatTable}}</div>
+
+<p> </p>
+
+<p><em>Desripción de la propiedad. Debe comenzar por "La propiedad <code>xyz</code> CSS " seguido de una descripción de una oración. El primer párrafo de esta introducción se utilizará por defecto como la descripción de la página.</em></p>
+
+<p>{{note("Para cualquier mensaje especial")}} <em>Pero no agregue varias notas. Estas deben ser realmente importantes, ¡o ser parte de la decripción!</em></p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="brush: css">/* Valores de palabras clave */
+property: value1;
+property: value2;
+
+/* &lt;longitud&gt; valores */
+property: 12.8em; /* Una longitud válida */
+
+/* Valores globales */
+property: inherit; &lt;-- Para recordar que son valores posibles
+property: initial;
+property: unset;
+</pre>
+
+<p><em>La segunda parte es una traducción simple de lo que dice la sintaxis formal. Está dirigido a usuarios de nivel medio que no comprenderán bien la sintaxis formal. </em></p>
+
+<h3 id="Values" name="Values">Valores</h3>
+
+<p><em>Cada elemento de la sintaxis formal debe ser explicado</em></p>
+
+<dl>
+ <dt><code>valor_1</code></dt>
+ <dd>Es una palabra clave que significa...</dd>
+ <dt><code>valor_2</code> {{ Non-standard_inline() }} {{experimental_inline()}}</dt>
+ <dd>Es una palabra clave que significa</dd>
+</dl>
+
+<h3 id="Sintaxis_formal">Sintaxis formal</h3>
+
+<p><em>La sintaxis formal debe ser tomada de la especificación y agregarse a la plantilla de 'CSSData'. Es una herramienta importante para obtener información precisa de la sintaxis para los usuarios avanzados.</em></p>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<p><em>Agregue esto solo si hay un ejemplo. Sin enlace roto aqui.</em></p>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush:css"><em>elementName {
+ </em>property<em>: value;
+ estoes: "ejemplo";
+ dream: 10000000mm;
+ amor: "peligro";
+}</em></pre>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html"><em>&lt;elementName&gt;foo bar&lt;/elementName&gt;</em></pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p><em>{{EmbedLiveSample("Examples")}}</em></p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<p><em>Utilizar exclusivamente esta tabla estándar. Coloque la especificación más antigua en la parte inferior. Use las plantillas SpecName() para el nombre y Spec2() para el estado. De esa manera, cuando la especificación progresa en el estándar, o se mueve, el contenido de la tabla se adaptará automáticamente.</em></p>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Especificación</th>
+ <th scope="col">Estado</th>
+ <th scope="col">Comentario</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName("CSS3 Animations", "#fake-link", "fake-value")}}</td>
+ <td>{{Spec2("CSS3 Animations")}}</td>
+ <td>Sin cambios desde CSS 2.1</td>
+ </tr>
+ <tr>
+ <td>{{SpecName("CSS2.1", "#fake-link", "fake value")}}</td>
+ <td>{{Spec2("CSS2.1")}}</td>
+ <td>Definición inicial</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad del navegador</h2>
+
+<p><em>(Ver <a href="/Project:en/Compatibility_tables" title="Project:en/Compatibility_tables">Tablas de compatibilidad</a> para más información)</em></p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li><em>Enlaces de propiedades relacionadas: {{Cssxref("ejemplo-propiedad")}}</em></li>
+ <li><em>Enlaces al artículo que muestra cómo usar la propiedad en contexto: "Usando ... artículo"</em></li>
+ <li><em>Use buenos enlaces externos. No tenga miedo de los enlaces externos, pero estos deberían ser sobresalientes, y no solo mencionar detalles menores.</em></li>
+</ul>
diff --git a/files/es/mdn/contribute/howto/enlace_cuenta_github/index.html b/files/es/mdn/contribute/howto/enlace_cuenta_github/index.html
new file mode 100644
index 0000000000..825081aead
--- /dev/null
+++ b/files/es/mdn/contribute/howto/enlace_cuenta_github/index.html
@@ -0,0 +1,110 @@
+---
+title: Como unir tu cuenta GitHub a tu perfil MDN
+slug: MDN/Contribute/Howto/enlace_cuenta_GitHub
+translation_of: Archive/MDN/Howto_Link_a_Github_account
+---
+<div>{{MDNSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/MDN")}}</div>
+
+<div class="note">
+<p><strong>Note: </strong>Support for Persona logins on MDN was disabled on November 1, 2016. The method for adding a Github account to your profile therefore no longer works. If you didn't add a GitHub login to your MDN account before we disabled Persona logins, please <strong>file an <a class="external external-icon" href="https://mzl.la/accounthelp">"Account Help" bug</a> </strong>on Bugzilla. For further reading about the end of life of Persona, see: <a href="https://wiki.mozilla.org/Identity/Persona_Shutdown_Guidelines_for_Reliers">Persona shutdown guidelines</a>.</p>
+</div>
+
+<p><span class="seoSummary">Debido a que el sistema de autentificacion de <a href="https://login.persona.org/">Persona</a>  Mozilla esta siendo cerrado, todos los usuarios que deseen contribuir a MDN necesitaran otra manera de ingresar desde el 1 de Noviembre del 2016. Actualmente, la unica alternativa soportada es  GitHub, debido a esto necesitaras una cuenta en <a href="https://github.com/">GitHub</a> para editar y contribuir apartir de esta fecha. Este articulo describe como añadir la autentificacion de GitHub  a tu perfil MDN.</span></p>
+
+<div class="warning">
+<p>Debes hacer esto antes del 1 de Noviembre de 2016, o no tendras modo de ingresar a MDN!</p>
+</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Añadir la autentificacion mediamte GitHub a tu cuenta no es dificíl. Entraremos en detalle más adelante, pero primero, aqui hay una pequeña lista de pasos necesarios:</p>
+
+<ol>
+ <li><a href="/en-US/docs/MDN/Signing_in">ingresa a tu cuenta MDN</a> mediante Persona.</li>
+ <li>Ve a la pagina <a href="https://developer.mozilla.org/en-US/users/account/connections">cuentas asosiadas</a>.</li>
+ <li>Añade la autentificacion GitHub.</li>
+</ol>
+
+<h2 id="Instrucciones_Detalladas">Instrucciones Detalladas</h2>
+
+<p>Esta es una guia paso a paso de todo lo que necesitas saber.</p>
+
+<h3 id="Ingresar_a_tu_cuenta_MDN">Ingresar a tu cuenta MDN</h3>
+
+<ol>
+ <li>En la parte superior de la pagina de MDN, hubica el mouse sobre <strong>Registrarse </strong>o da tap para llegara este cuadro. aqui se muestran los metodos de autentificacion disponibles, <strong>Persona</strong> y <strong>GitHub</strong>.<br>
+ <img alt="Sign in box on MDN, showing Persona and Github." src="https://mdn.mozillademos.org/files/13773/Persona%20Sign%20in%202016-08.png" style="border-style: solid; border-width: 1px; height: 162px; width: 414px;"></li>
+ <li>Seleciona <strong>Persona</strong>, y usa tus datos de usuario usuales. si obtienes un error de inicio no reconocido, asegurese de estar ingresando la cuenta de correo con la que se unio a MDN, esta puede ser su direccion de correo usual. Si aún tienes problemas, mira {{anch("Persona no me reconoce")}}.</li>
+</ol>
+
+<h3 id="Ir_a_la_pagina_cuentas_asociadas">Ir a la pagina "cuentas asociadas"</h3>
+
+<p>Existen dos maneras de llegara esta pagina.</p>
+
+<p>La primera y mas gacil es dar click en el siguiente link.</p>
+
+<p>Otra manera seria, haciendo:</p>
+
+<ol>
+ <li>Dar Click en tu nombre de usuario en la parte superior de cualquier pagina MDN. (en la misma posicion donde aparecia <strong>Registrarse</strong> cuando aún no habia ingresado.) Esta lo enviara a su pagina de perfil.</li>
+ <li>Abra el "menu", y da click en <strong>Cuentas Asociadas</strong>.<br>
+ <img alt='Gear menu in profile, showing the "Account connections" option' src="https://mdn.mozillademos.org/files/13428/SheppyWork___MDN_-__Private_Browsing_.png" style="height: 217px; width: 219px;"></li>
+</ol>
+
+<h3 id="Añadir_autentificación_GitHub">Añadir autentificación GitHub</h3>
+
+<p>You're now on the "Account connections" page, which lists the external accounts you've already linked to your MDN profile. If GitHub is already listed, congratulations! You're ready to go! But test it to be sure you remember your password, by signing out of MDN and signing back in using your GitHub credentials.</p>
+
+<p>If GitHub isn't already listed, then near the bottom of the page, look below the list of already-linked external accounts. There you'll find a section called <strong>Connect a new account</strong>, which lists the types of accounts you can connect to your MDN profile. It looks something like this:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13430/Account_Connections___MDN_-__Private_Browsing_.png" style="height: 79px; width: 476px;"></p>
+
+<p>To add GitHub:</p>
+
+<ol>
+ <li>Click  <strong>Connect with GitHub</strong>. MDN will contact GitHub to request  permission to link the accounts.  If you're not already signed in to GitHub, you'll be asked to do so:<br>
+ <img alt="Screenshot of GitHub sign in window." src="https://mdn.mozillademos.org/files/13444/GitHub_Sign_In.png" style="height: 447px; width: 356px;"></li>
+ <li>If you have two-factor authentication enabled on your GitHub account, you'll be asked to enter your authentication code:<br>
+ <img alt="Screenshot of GitHub's Two-factor authentication window." src="https://mdn.mozillademos.org/files/13460/GitHub_-_Where_software_is_built.png" style="height: 448px; width: 361px;"></li>
+ <li>Now that you're signed in to your GitHub account, you'll be asked to authorize the link between GitHub and MDN (unless you already have this authorization on file for some reason). This page is shown below.<br>
+ <img alt='Screenshot of GitHub "Authorize application" window.' src="https://mdn.mozillademos.org/files/13456/Authorize_Mozilla_Developer_Network.png" style="height: 420px; width: 766px;"><br>
+ Click the green <strong>Authorize application</strong> button to grant permission for your MDN profile to access your GitHub account. If the GitHub account is successfully linked to your MDN profile, you'll see this message:<br>
+ <img alt="Account successfully created." src="https://mdn.mozillademos.org/files/13454/Edit_Your_Profile___MDN.png" style="height: 57px; width: 646px;"></li>
+</ol>
+
+<p>Not only can you now use GitHub to sign in to MDN, but you're actually already signed in using your GitHub authentication! You're now ready for the Persona shutdown. Be sure to update any password managers you may have installed, if necessary.</p>
+
+<h2 id="Troubleshooting">Troubleshooting</h2>
+
+<p>If you run into problems while trying to add your GitHub account to your profile, hopefully the troubleshooting tips below will help. If they don't, please don't hesitate to ask us for help on the <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">MDN Web Docs chat room</a>.</p>
+
+<h3 id="Error_Could_not_find_profile_matching_account">Error: Could not find profile matching account</h3>
+
+<p>If you try to add your GitHub account to your profile and get the error "Could not find profile matching account," it can mean a few different things. If you have multiple accounts on your GitHub account, there may be some confusion; GitHub may not report the expected email address to MDN during the account pairing attempt, which will result in this error. Other glitches in the process may also result in the same error message.</p>
+
+<p>One way to work around this problem: open a new private window in your browser; in Firefox, for example, choose "New Private Window" in the File menu (or press <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>P</kbd> [<kbd>Cmd</kbd>-<kbd>Shift</kbd>-<kbd>P</kbd> on Mac]). Browse to MDN there, <a href="/en-US/docs/MDN/Signing_in">sign into your MDN account</a>, then try again to add your GitHub account to your profile as covered above.</p>
+
+<p>Also, be sure that when you try to log into Persona to</p>
+
+<h3 id="My_GitHub_authorization_is_not_displayed_on_the_Account_Connections_page.">My GitHub authorization is not displayed on the Account Connections page.</h3>
+
+<p>That might be a caching issue. Reloading the page or loggin out and loggin in again should solve the problem.</p>
+
+<h3 id="Persona_doesnt_remember_me">Persona doesn't remember me</h3>
+
+<p>If you try to log into Persona so you can add a GitHub login to your MDN account and get told "Your email address is new to us," this is likely because it's been long enough since you last logged into Persona that they've deleted your email address from their system. This happens after some period of time; the Persona login window looks like this in that situation:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13765/unknown-to-persona.png" style="height: 533px; width: 800px;"></p>
+
+<p>If this happens, you need to simply follow Persona's instructions to create a new password for that email address. MDN doesn't care about this process; the fact that your email address matches up is all that matters. A confirmation email will be sent to verify that you own the email address, probably from <code>no-reply@persona.org</code>. If you have spam filtering, it may be sent to your spam folder.</p>
+
+<p>Once you've finished the process of setting the password for the email address you used to log into MDN, your access to MDN will be restored. Then you can follow the steps in {{anch("Detailed instructions")}} above to add your GitHub login to your MDN account.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/MDN/Contribute/Howto/Create_an_MDN_account">How to create an MDN account</a></li>
+ <li><a href="/en-US/docs/MDN/Getting_started">Getting started on MDN</a></li>
+</ul>
diff --git a/files/es/mdn/contribute/howto/etiquetas_paginas_javascript/index.html b/files/es/mdn/contribute/howto/etiquetas_paginas_javascript/index.html
new file mode 100644
index 0000000000..42edc03ff0
--- /dev/null
+++ b/files/es/mdn/contribute/howto/etiquetas_paginas_javascript/index.html
@@ -0,0 +1,83 @@
+---
+title: Cómo etiquetar páginas Javascript
+slug: MDN/Contribute/Howto/Etiquetas_paginas_javascript
+tags:
+ - Etiquetas
+ - JavaScript
+translation_of: MDN/Contribute/Howto/Tag_JavaScript_pages
+---
+<div>{{MDNSidebar}}</div><p class="summary"><strong>Etiquetar </strong>consiste en agregar meta-información (o información adicional) a las páginas para que el contenido relacionado pueda agruparse, por ejemplo en la herramienta de búsqueda.</p>
+<table class="fullwidth-table">
+ <tbody>
+ <tr>
+ <td><strong>¿Dónde hay que hacerlo?</strong></td>
+ <td>Dentro de <a href="/en-US/docs/Web/JavaScript/Doc_status#No_tags">páginas específicas relacionadas con JavaScript que aún no tengan etiquetas</a></td>
+ </tr>
+ <tr>
+ <td><strong>¿Qué necesitas saber para hacer esta tarea?</strong></td>
+ <td>
+ <ul>
+ <li>Conocimiento básico de código JavaScript, como saber qué es un método o una propiedad.</li>
+ </ul>
+ </td>
+ </tr>
+ <tr>
+ <td><strong>¿Cuáles son los pasos para hacerla?</strong></td>
+ <td>
+ <ol>
+ <li>Elige una de las páginas del la lista que se encuentra en el enlace anterior.</li>
+ <li>Haz Click en el enlace del artículo para cargar la página.</li>
+ <li>Una vez cargada la página, haz click en el botón <strong>EDIT</strong> cerca de la parte superior ( esto te coloca en el editor MDN).</li>
+ <li>Cómo mínimo se debería agregar la etiqueta <code>JavaScript</code>. Aquí hay otras etiquetas que se pueden agregar:</li>
+ <li><br>
+ <table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Tag</th>
+ <th scope="col">What pages to use it on</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>Method</code></td>
+ <td>métodos</td>
+ </tr>
+ <tr>
+ <td><code>Property</code></td>
+ <td>propiedades</td>
+ </tr>
+ <tr>
+ <td><code>prototype</code></td>
+ <td>prototipos</td>
+ </tr>
+ <tr>
+ <td>Object type name</td>
+ <td>métodos de un objeto; por ejemplo String.fromCharCode debería llevar la etiqueta <code>String</code></td>
+ </tr>
+ <tr>
+ <td><code>ECMAScript6 </code>and <code>Experimental</code></td>
+ <td>características agregadas en una nueva versión ECMAScript</td>
+ </tr>
+ <tr>
+ <td><code>Deprecated</code></td>
+ <td>características desaprobadas (cuyo uso está desaconsejado pero aún tiene soporte)</td>
+ </tr>
+ <tr>
+ <td><code>Obsolete</code></td>
+ <td>características obsoletas (que ya no tienen soporte en los navegadores modernos)</td>
+ </tr>
+ <tr>
+ <td>others</td>
+ <td>Ver <a href="/en-US/docs/Project:MDN/Contributing/Tagging_standards">Mestándares de etiquetado MDN</a> para otras etiquetas posibles a aplicar</td>
+ </tr>
+ </tbody>
+ </table>
+ </li>
+ <li>Guarda con un comentario.</li>
+ <li>¡Y Listo!</li>
+ </ol>
+ </td>
+ </tr>
+ </tbody>
+</table>
+<p> </p>
diff --git a/files/es/mdn/contribute/howto/index.html b/files/es/mdn/contribute/howto/index.html
new file mode 100644
index 0000000000..611bc03e83
--- /dev/null
+++ b/files/es/mdn/contribute/howto/index.html
@@ -0,0 +1,15 @@
+---
+title: Guías prácticas
+slug: MDN/Contribute/Howto
+tags:
+ - Documentation
+ - Landing
+ - MDN
+ - TopicStub
+translation_of: MDN/Contribute/Howto
+---
+<div>{{MDNSidebar}}</div><div>{{IncludeSubnav("/es/docs/MDN")}}</div>
+
+<p>Estos artículos proveen guías paso a paso para lograr metas específicas cuando se contribuye a MDN.</p>
+
+<p>{{LandingPageListSubpages}}</p>
diff --git a/files/es/mdn/contribute/howto/remover_macros_experimentales/index.html b/files/es/mdn/contribute/howto/remover_macros_experimentales/index.html
new file mode 100644
index 0000000000..25ee6439cd
--- /dev/null
+++ b/files/es/mdn/contribute/howto/remover_macros_experimentales/index.html
@@ -0,0 +1,48 @@
+---
+title: Cómo y cuándo eliminar macros "experimentales"
+slug: MDN/Contribute/Howto/Remover_Macros_Experimentales
+tags:
+ - Experimental
+ - Guía
+ - MDN Meta
+ - Macros
+translation_of: MDN/Contribute/Howto/Remove_Experimental_Macros
+---
+<div>{{MDNSidebar}}{{IncludeSubnav("/en-US/docs/MDN")}}</div>
+
+<p class="summary">Las páginas en MDN pueden incluir<span class="seoSummary"><a href="/en-US/docs/MDN/Contribute/Structures/Macros">macros</a></span>KumaScriptpara notificar a los lectores que una característica es experimental y aún no está estandarizada. Sin embargo, algún elementos experimental pueden estandarizarse y sin embargo su página todavía no refleja este cambio. Puedes ayudar a mejorar MDN revisando las páginas que contienen estas macros "experimentales" y eliminando las macros de los elementos que ya no son experimentales.</p>
+
+<p>Las macros en cuestión son {{TemplateLink("experimental_inline")}} para marcar un elemento mencionado en una página, y {{TemplateLink("SeeCompatTable")}} para marcar toda la página.</p>
+
+<div class="blockIndicator warning" style="background: #fff3d4; border-color: #f6b73c;">
+<p><strong>Advertencia:</strong> ya no recomendamos usar<code>SeeCompatTable</code>. Ahora se espera que todos los datos sobre compatibilidad se presenten dentro de la tabla de compatibilidad del navegador y cualquier nota al pie de página.</p>
+</div>
+
+<p>Aquí está la definición de <a href="/en-US/docs/MDN/Contribute/Guidelines/Conventions_definitions">experimental</a> del artículo <a href="/en-US/docs/MDN/Contribute/Guidelines/Conventions_definitions">MDN Definitions and Conventions</a>:</p>
+
+<p><strong>¿Dónde debe hacerse esta tarea?</strong></p>
+
+<p>Páginas en las siguientes listas:</p>
+
+<dl>
+ <dd>
+ <ul>
+ <li><a href="https://developer.mozilla.org/search?kumascript_macros=experimental_inline&amp;locale=*" rel="nofollow noopener">Todas las páginas que usan <code>\{{Experimental_Inline}}</code></a> (list item icon)</li>
+ <li><a href="https://developer.mozilla.org/search?kumascript_macros=experimental_inline&amp;locale=en-US" rel="nofollow noopener">Todas las páginas en Inglés que usan <code>\{{Experimental_Inline}}</code></a> (list item icon)</li>
+ <li><a href="https://developer.mozilla.org/en-US/search?kumascript_macros=SeeCompatTable&amp;locale=*" rel="nofollow noopener">Todas las páginas en MDN que usan <code>\{{SeeCompatTable}}</code></a> (page banner)</li>
+ <li><a href="https://developer.mozilla.org/en-US/search?kumascript_macros=SeeCompatTable&amp;locale=en-US" rel="nofollow noopener">Todas las páginas en Ingles <code>que usan \{{SeeCompatTable}}</code></a> (page banner)</li>
+ </ul>
+ </dd>
+ <dt>¿Qué necesitas saber para hacer la tarea?</dt>
+ <dd>Conocimiento del estado de estandarización o implementación del elemento relevante.</dd>
+ <dt>¿Cuáles son los pasos para hacer la tarea?</dt>
+ <dd>
+ <ol>
+ <li>Revise la página para ver con qué elemento o elementos está asociada la macro.</li>
+ <li>Determine si cada elemento sigue siendo experimental o no. La tabla de compatibilidad en la página puede ser más actual que las macros; También puede probar utilizando el elemento en varios navegadores.</li>
+ <li>Si un elemento ya no es experimental, elimine la llamada de macro "experimental" asociada a él. (Nota: un elemento en una página de resumen que tiene la macro {{TemplateLink ("experimental_inline")}} al lado suele ser un enlace a una página de referencia completa, que contiene la macro {{TemplateLink ("SeeCompatTable")}}.</li>
+ <li>Guarde la página con un comentario sobre lo que hizo.</li>
+ <li>Si ha eliminado todas las macros "experimentales" de una página (para las macros en línea, puede eliminar solo algunas de ellas), fuerce una actualización (Mayús + Actualizar) en la página de resultados de búsqueda relevante (vinculada anteriormente) para asegurarse de que la lista esté actualizado.</li>
+ </ol>
+ </dd>
+</dl>
diff --git a/files/es/mdn/contribute/howto/revision_editorial/index.html b/files/es/mdn/contribute/howto/revision_editorial/index.html
new file mode 100644
index 0000000000..454da031a0
--- /dev/null
+++ b/files/es/mdn/contribute/howto/revision_editorial/index.html
@@ -0,0 +1,54 @@
+---
+title: Cómo hacer una revisión editorial
+slug: MDN/Contribute/Howto/revision_editorial
+tags:
+ - Cómo hacerlo
+ - Documentación
+ - Guía
+ - Revisiones
+translation_of: MDN/Contribute/Howto/Do_an_editorial_review
+---
+<div>{{MDNSidebar}}</div>
+
+<p class="summary"><strong>La revisión editorial consiste en reparar errores tipográficos y de ortografía</strong>, gramática, o errores de uso en un artículo. No todos los contribuyentes son expertos en escribir en español, pero gracias a su conocimiento han contribuído en los artículos en enorme cantidad, los cuales necesitan correcciones y revisiones. Esto se hace en la revisión editorial.</p>
+
+<table class="fullwidth-table">
+ <tbody>
+ <tr>
+ <td><strong>¿Cuál es la tarea?</strong></td>
+ <td> Verificar y corregir la gramática, ortografía y contexto de los artículos.</td>
+ </tr>
+ <tr>
+ <td><strong>¿Dónde hay que hacerla?</strong></td>
+ <td>Dentro de artículos específicos que están marcados como que requieren una revisión editorial.</td>
+ </tr>
+ <tr>
+ <td><strong>¿Qué necesitas saber para hacer la tarea?</strong></td>
+ <td>Necesitas tener buen manejo de la gramática española y su ortografía.</td>
+ </tr>
+ <tr>
+ <td><strong>¿Cuáles son los pasos para hacerlo?</strong></td>
+ <td>
+ <ol>
+ <li>Elige un artículo:
+ <ol>
+ <li>Ve a la lista de <a href="/es/docs/needs-review/editorial">artículos que necesitan revisión editorial</a>.  Esto lista todas las páginas para las que se solicitó una revisión editorial.</li>
+ <li>Elige una página que tenga un título en español y cuya ruta no empiece con <code>Template:</code>.</li>
+ <li>Haz click en el enlace del artículo para cargar la página.</li>
+ </ol>
+ </li>
+ <li>Una vez cargada la página, haz click en el boton editar (<strong>EDIT)</strong> de la parte superior; esto te lleva al <a href="/es/docs/Project:MDN/Contributing/Editor_guide">editor MDN</a>. No dudes en cambiar a una página diferente si la primera que eliges no te conviene.</li>
+ <li>Corrige todos los errores tipográficos y ortográficos, gramática, o de uso que veas.</li>
+ <li>Ingresa un <strong>Comentario Revisión </strong>en la parte superior del artículo; algo como "Revisión editorial<em>: errores de tipografía, gramática y ortografía <em>reparados</em>."</em></li>
+ <li>Haz click en el boton <strong>GUARDAR LOS CAMBIOS (SAVE CHANGES)</strong>.</li>
+ <li>Una vez que el artículo corregido aparezca en la pantalla después de haberse cerrado el editor, marca la entrada <strong>Editorial</strong> al costado debajo de <strong>Se han solicitado las siguientes revisiones</strong> (<strong>The following reviews have been requested) </strong>y haz click en <strong>ENVIAR REVISION (SUBMIT REVIEW)</strong>.</li>
+ <li>
+ <p>¡Listo!</p>
+ </li>
+ </ol>
+ </td>
+ </tr>
+ </tbody>
+</table>
+
+<p> </p>
diff --git a/files/es/mdn/contribute/howto/revision_tecnica/index.html b/files/es/mdn/contribute/howto/revision_tecnica/index.html
new file mode 100644
index 0000000000..e1fc2d5d5a
--- /dev/null
+++ b/files/es/mdn/contribute/howto/revision_tecnica/index.html
@@ -0,0 +1,44 @@
+---
+title: Cómo hacer una revisión técnica
+slug: MDN/Contribute/Howto/revision_tecnica
+translation_of: MDN/Contribute/Howto/Do_a_technical_review
+---
+<div>{{MDNSidebar}}</div><p class="summary"><strong>La revisión técnica consiste en revisar la precisión técnica y lo completo que se encuentra un artículo</strong>, y corregirlo si es necesario. Si un escritor de un artículo quiere que alguien más chequee su contenido técnico, debe marcar la casilla "Revisión Técnica" (Technical review) al editarlo. A menudo el escritor contacta a un ingeniero específico para desempeñar la revisión técnica, pero cualquiera con habilidad técnica en el tema puede hacerla.</p>
+
+<p><span class="seoSummary">Este artículo describe cómo hacer para ejecutar una revisión técnica, ayudando así a asegurar que el contenido de MDN es preciso.</span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+ <tr>
+ <td><strong>¿Dónde hay que hacerla?</strong></td>
+ <td>En artículos específicos marcados requiriendo <a href="/en-US/docs/needs-review/technical">revisión técnica</a>.</td>
+ </tr>
+ <tr>
+ <td><strong>¿Qué necesitas saber para hacer la tarea?</strong></td>
+ <td>
+ <ul>
+ <li>Conocimiento experto del tema del artículo que estás revisando.</li>
+ <li>Habilidad para editar un artículo wiki en MDN.</li>
+ </ul>
+ </td>
+ </tr>
+ <tr>
+ <td><strong>¿Cuáles son los pasos para hacerlo?</strong></td>
+ <td>
+ <ol>
+ <li>Vé a la lista de páginas que necesitan <a href="/en-US/docs/needs-review/technical">revisiones técnicas</a>. Ésta lista todas las páginas para las cuales se solicitó revisión técnica.</li>
+ <li>Elige una página con cuyo tema estés muy familiarizado.</li>
+ <li>Haz click en el enlace del artículo para cargar la página.</li>
+ <li>Una vez cargada la página, haz click en el botón  <strong>EDITAR (EDIT)</strong> de la parte superior; esto te lleva al editor MDN. No dudes en cambiar a una página diferente si la primera que eliges no te conviene.</li>
+ <li>Mientras lees el artículo, corrige cualquier información técnica que no esté correcta y agrega cualquier información importante que falte.</li>
+ <li>Ingresa un comentario al pie del artículo que describa lo que hiciste, como "Revisión técnica completa". Si corregiste la información, incluye eso en tu comentario, por ejemplo "<em>Revisión Técnica: descripciones de parámetros arregladas".</em></li>
+ <li>Haz click en el botón <strong>GUARDAR LOS CAMBIOS (SAVE CHANGES)</strong>.</li>
+ <li>Una vez que corregiste el artículo aparece en la pantalla después que el editor se haya cerrado, chequea la entrada <strong>Técnica</strong> al costado, debajo de <strong>Las siguientes revisiones han sido solicitadas (The following reviews have been requested</strong>) y haz click en <strong>ENVIAR REVISIÓN (SUBMIT REVIEW)</strong>.</li>
+ <li>Y listo!</li>
+ </ol>
+ </td>
+ </tr>
+ </tbody>
+</table>
+
+<p> </p>
diff --git a/files/es/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/es/mdn/contribute/howto/set_the_summary_for_a_page/index.html
new file mode 100644
index 0000000000..26f62b04a2
--- /dev/null
+++ b/files/es/mdn/contribute/howto/set_the_summary_for_a_page/index.html
@@ -0,0 +1,118 @@
+---
+title: Cómo colocar el resumen de una página
+slug: MDN/Contribute/Howto/Set_the_summary_for_a_page
+tags:
+ - Documentación
+ - Resumen
+ - SEO
+ - Summary
+ - primeros pasos
+translation_of: MDN/Contribute/Howto/Set_the_summary_for_a_page
+---
+<div>{{MDNSidebar}}</div>
+
+<div>
+<div>{{IncludeSubnav("/en-US/docs/MDN")}}</div>
+
+<div>
+<p>En este artículo te mostraremos cómo configurar el <strong>resumen SEO</strong> (también conocido como la descripción o simplemente como el resumen) de un artículo en el sitio de MDN Web Docs. El resumen se usa de varias maneras:</p>
+
+<ul>
+ <li>Lo utilizan Google y otros motores de búsqueda para ayudar a catalogar e indexar páginas.</li>
+ <li>Los motores de búsqueda muestran el resumen en las páginas de resultados de búsqueda para ayudar a los lectores a elegir la página que mejor se adapte a sus necesidades.</li>
+ <li>Los menús de MDN a menudo muestran el resumen debajo del título del artículo para ayudar a los usuarios a encontrar la información que buscan.</li>
+ <li>Los enlaces en MDN tienen información sobre las herramientas del resumen, para proporcionar una visión rápida a los usuarios sin tener que hacer clic en el artículo en sí.</li>
+</ul>
+
+<p>Por lo tanto, el resumen debe ser un texto que tenga sentido tanto en el contexto del artículo como cuando se presenta solo en otros contextos. Se debe tener en cuenta la guía de estilo de escritura MDN al escribir el texto de resumen.</p>
+</div>
+</div>
+
+<h2 id="El_resumen_predeterminado">El resumen predeterminado</h2>
+
+<p>Las páginas para las que no se ha establecido un resumen toman como resumen el texto completo del primer bloque de {{Glossary("HTML")}} que parezca tener contenido de texto en lugar de un título. Sin embargo, este texto puede no se el mejor para usar por varias razones:</p>
+
+<ul>
+ <li>Si el primer bloque de texto es una nota recordatoria en lugar de una descripción general útil del contenido del artículo.</li>
+ <li>Si el primer bloque de texto es un párrafo de contenido pero no contiene una buena descripción general del artículo.</li>
+ <li>El texto es demasiado largo (o demasiado corto).</li>
+</ul>
+
+<p>Por esto es mejor establecer explícitamente el resumen de la página, para ayudar a garantizar que el resumen sea lo más útil posible.</p>
+
+<h2 id="Estableciendo_el_resumen">Estableciendo el resumen</h2>
+
+<p>Veamos cómo configurar el resumen de una página.</p>
+
+<h3 id="¿Cuál_es_la_tarea">¿Cuál es la tarea?</h3>
+
+<p>Marcar el texto dentro de una página que debe usarse como resumen en otros contextos; Si el texto apropiado no está disponible, esta tarea puede incluir escribir una pequeña cantidad de texto apropiado.</p>
+
+<h3 id="¿Dónde_necesita_ser_hecho">¿Dónde necesita ser hecho?</h3>
+
+<p>En las páginas que carecen de un resumen, las que tengan un resumen que no sea útil, o que tengan un resumen que no cumpla innecesariamente con las pautas recomendadas.</p>
+
+<h3 id="¿Qué_necesitas_saber_para_hacer_la_tarea">¿Qué necesitas saber para hacer la tarea?</h3>
+
+<p>Necesitas saber usar el editor MDN. También necesitas buenas habilidades de escritura y familiaridad con el tema de la página a resumir.</p>
+
+<h3 id="¿Cuáles_son_los_pasos_para_hacerlo">¿Cuáles son los pasos para hacerlo?</h3>
+
+<ol>
+ <li>Elige una página a la que quieras colocarle un resumen:
+ <ol>
+ <li>En la página de <a href="/en-US/docs/MDN/Doc_status">estado de la documentación MDN</a>, haz clic en el enlace debajo de  <strong>Secciones (Sections)</strong> para un tema en el que tengas conocimientos (por ejemplo, HTML).<br>
+ <img alt="" src="https://mdn.mozillademos.org/files/8681/sections.png" style="height: 272px; width: 1053px;"></li>
+ <li>En la página de estado de la documentación del tema, haz clic en la cabecera <strong>Páginas (Pages) </strong>de la tabla <strong>Resumen (Su</strong><strong>mmary)</strong>. Esto te va a llevar a un índice de todas las páginas en esa sección del tema. Muestra los enlaces de la página en la columna izquierda y las etiquetas y resúmenes en la columna derecha.<br>
+ <img alt="" src="https://mdn.mozillademos.org/files/8675/pages.png" style="height: 188px; width: 826px;"></li>
+ <li>Elige una página en la que falte el resumen o que tenga uno pobre.<br>
+ <img alt="" src="https://mdn.mozillademos.org/files/8677/summary.png" style="height: 64px; width: 497px;"></li>
+ <li>Haz clic en el enlace para ir a esa página.</li>
+ </ol>
+ </li>
+ <li>Haz clic en <strong>Editar (Edit)</strong> para abrir la página en el editor MDN.</li>
+ <li>Busca una oración o dos que anden como resumen fuera del contexto. Si fuera necesario, edita el contenido existente para crear o modificar las oraciones y así obtener un buen resumen.</li>
+ <li>Selecciona el texto a usar como resumen.</li>
+ <li>En el widget <em>Estilos (Styles)</em> de la barra de herramientas del editor selecciona <strong>Resumen SEO (SEO Summary)</strong>. (En el código fuente de la página, esto crea un elemento  {{HTMLElement("span")}} con <code>class="seoSummary"</code> encerrando el texto seleccionado).<br>
+ <img alt="" src="https://mdn.mozillademos.org/files/8679/styles.png" style="height: 388px; width: 676px;"></li>
+ <li>Guarda tus cambios con un comentario de revisión como "Coloqué el resumen a la página".</li>
+</ol>
+
+<h2 id="Elaboración_de_un_buen_resumen">Elaboración de un buen resumen</h2>
+
+<p>El resumen se utiliza en diversos escenarios entre los que se pueden incluir:</p>
+
+<ul>
+ <li>La descripción del artículo en las páginas de resultados de búsqueda en MDN así como en Google y otros motores de búsqueda.</li>
+ <li>La descripción del artículo en los menús y páginas de aterrizaje de temas en MDN.</li>
+ <li>Las descripciones emergentes contextuales cuando el usuario pasa el cursor sobre los enlaces a los artículos en MDN.</li>
+</ul>
+
+<p>Es importante tener presentes estos escenarios mientras se crea un resumen. Para garantizar que el resumen funcione bien en todas estas situaciones, esfuérzate por ceñirte a las pautas que se indican a continuación.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> a menos que se indique específicamente lo contrario, estas son orientaciones, no reglas rígidas y rápidas. Aunque debes esforzarte por cumplir estas directrices, en ocasiones se presentan excepciones que no se pueden evitar.</p>
+</div>
+
+<ul>
+ <li> El resumen debe indicar tanto el tema como el tipo de página. Por ejemplo «En esta guía, aprenderemos a utilizar la API del Observador de Intersección para crear aplicaciones web adaptables que actualizan únicamente las animaciones actualmente visibles en pantalla» es de 189 caracteres y explica qué tecnología se está cubriendo, cómo se está utilizando y que el artículo es un tutorial.</li>
+ <li>Se puede elegir el texto de cualquier lugar de cualquier párrafo del artículo, pero lo ideal sería que estuviera en el primer párrafo (o en el segundo, en algunos casos). Si el propósito del artículo no aparece en estos párrafos, es probable que necesite reescribirse la introducción de la página.</li>
+ <li>El resumen debe ajustarse bien al contexto del cuerpo del artículo, ya que de hecho forma parte del artículo.</li>
+ <li>Está bien tener enlaces a otras páginas dentro del resumen. Estos se eliminan automáticamente antes de entregarlos a los motores de búsqueda y no te afectan. También se eliminan antes de que el resumen se utilice como descripción emergente. Los enlaces<em> no</em> se eliminan del resumen cuando se emplean como descripción de la página dentro de los menús y páginas de destino en MDN, lo cual también es muy conveniente.</li>
+ <li>El resumen debe incluir una selección apropiada de los términos clave que probablemente busque alguien que averigüe por información contenida en la página. En el caso del ejemplo de la API del Observador de Intersecciones, esas palabras clave incluyen el nombre de la API, «animaciones», «visible», «adaptable» y «aplicaciones web», entre otras.</li>
+ <li>Para optimizar el valor del <strong>posicionamiento en buscadores</strong> (<em>Search Engine Optimization, SEO</em>) obtenido de un resumen, este no debe tener más de 150 caracteres de longitud.</li>
+ <li>Puesto que una <strong>página de resultados de un motor de búsqueda</strong> (<em>Search Engine Result Page, SERP</em>) no suele mostrar más de 160 caracteres del resumen, se deben evitar resúmenes de mayor longitud. El hecho de que se corte el texto sin escrúpulos puede disuadir a las personas a pulsar en el enlace.</li>
+ <li>
+ <p>Puede resultar tentador escribir un gran resumen que no funcione en la página y luego ocultarlo dentro de un bloque con la clase <code>«hidden»</code> en él. Pero <em>esto no funciona</em>, dado que los motores de búsqueda ignoran el texto que no es visible para el usuario.</p>
+ </li>
+</ul>
+
+<p>Piensa en el resumen como si fuera una especie de {{interwiki("wikipedia", "blurb")}} en el interior de la cubierta o la contracubierta de un libro. Este texto corto tiene que captar la atención del lector rápidamente y animarle a seguir leyendo.</p>
+
+<p>Puede ser un poco complicado redactar un resumen que funcione bien tanto para las páginas de resultados de los motores de búsqueda como dentro del propio texto del artículo, pero en el momento MDN no ofrece una forma de crear un resumen SEO separado del contenido de la página, de modo que haz tu mejor esfuerzo.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs//es/docs/MDN/Contribute/Howto/Write_for_SEO">How to write with SEO in mind on MDN Web Docs</a></li>
+</ul>
diff --git a/files/es/mdn/contribute/howto/tag/index.html b/files/es/mdn/contribute/howto/tag/index.html
new file mode 100644
index 0000000000..d477bae0fc
--- /dev/null
+++ b/files/es/mdn/contribute/howto/tag/index.html
@@ -0,0 +1,385 @@
+---
+title: Cómo etiquetar correctamente las páginas
+slug: MDN/Contribute/Howto/Tag
+tags:
+ - Colaborar
+ - Etiquetas
+ - Guia(2)
+ - Guía
+ - MDN
+ - Principiante
+translation_of: MDN/Contribute/Howto/Tag
+---
+<div>{{MDNSidebar}}</div><p><strong>"Article tags"</strong> Las etiquetas del artículo son una forma importante para poner a los visitantes en contacto con contenido útil. Cada página normalmente debería contener varias etiquetas para ayudar a mantener organizado el contenido. En esta página se explica la mejor manera de marcar las páginas para que así  nuestros lectores puedan encontrar la información y podamos mantenernos organizados.</p>
+
+<p>Si necesita ayuda con la interfaz de usuario de edición de etiquetas, consulte la sección de etiquetado <a href="https://developer.mozilla.org/en-US/docs/MDN/Contribute/Editor/Basics#The_tags_box">tagging section</a> en nuestra guía del editor.</p>
+
+<p>Por favor utilice las etiquetas como se explica a continuación. Si no, nuestras herramientas automatizadas no generarán correctamente las listas de contenido, las páginas de destino y el entrecruzamiento de artículos.</p>
+
+<h2 id="Cómo_usa_MDN_las_etiquetas_(tags)">Cómo usa MDN las etiquetas (tags)</h2>
+
+<p>Hay varias maneras de usar las etiquetas en MDN:</p>
+
+<dl>
+ <dt>"Document categorization" Categorización de documentos</dt>
+ <dd>¿Qué clase de documento es? ¿Es una referencia? ¿Un tutorial? ¿Una página de inicio?  Nuestros visitantes pueden usar estas etiquetas para filtrar búsquedas, ¡así que son realmente importantes!</dd>
+ <dt>"Topic identification" Identificación del tema</dt>
+ <dd>¿Qué tema cubre el artículo? ¿Trata sobre una API? ¿El DOM? ¿Gráficos? Estas también son importantes porque se pueden usar en filtros de búsquedas.</dd>
+ <dt>"Technology status" Estado de la tecnología</dt>
+ <dd>¿Cuál es el estado de la tecnología? ¿No es estándar? ¿Obsoleto o en desuso? ¿Experimental?</dd>
+ <dt>"Skill level" Nivel de habilidad</dt>
+ <dd>Para tutoriales y guías, ¿cómo es de avanzado el material cubierto por el artículo?</dd>
+ <dt>"Document metadata" Documento de recursos</dt>
+ <dd>La comunidad de escritores utiliza las etiquetas para hacer un seguimiento de qué páginas necesitan qué tipo de trabajo.</dd>
+</dl>
+
+<h2 id="Tipos_de_etiquetas">Tipos de etiquetas</h2>
+
+<p>Guía rápida de tipos de etiquetas y sus posibles valores.</p>
+
+<h3 id="Categoría_de_documento">Categoría de documento</h3>
+
+<p>Cuando se etiqueta un artículo con una de estas categorías, estas ayudando a las herramientas automáticas a generar con mayor precisión las páginas de destino, tablas de contenido, etc. Estos términos también serán usados por nuestro nuevo motor de búsqueda,  para que nuestros visitantes puedan localizar a su antojo referencias o información de la guía.</p>
+
+<p>Utilizamos los siguientes nombres de categoría como etiquetas de marcado estándar:</p>
+
+<dl>
+ <dt><code>{{Tag("Introducción")}}</code></dt>
+ <dd>El artículo proporciona material introductorio sobre un tema. Lo ideal sería tener solo una etiqueta "Introducción" por tema tecnológico tratado.</dd>
+ <dt><code>{{Tag("Destacado")}}</code></dt>
+ <dd>El artículo es crítico y se mostrará de forma destacada en las páginas de inicio. Esta etiqueta se usara con moderación (nunca más de tres documentos por tema).</dd>
+ <dt><code>{{Tag("Referencia")}}</code></dt>
+ <dd>El artículo contiene material de referencia de una API, elemento, atributo, propiedad o similares.</dd>
+ <dt><code>{{Tag("Inicio")}}</code></dt>
+ <dd>Es una página de inicio.</dd>
+ <dt><code>{{Tag("Guía")}}</code></dt>
+ <dd>El artículo es una página de cómo hacerlo o guía.</dd>
+ <dt><code>{{Tag("Ejemplo")}}</code></dt>
+ <dd>El artículo es una página de ejemplo de código o contiene ejemplos de código (es decir, fragmentos reales de código útil y no de una sola línea "ejemplos de sintaxis").</dd>
+</dl>
+
+<h3 id="Temas">Temas</h3>
+
+<p>Mediante la identificación del área temática del artículo, estás ayudando a generar mejores resultados de búsqueda, páginas de inicio y navegación.</p>
+
+<p>Si bien hay cierta flexibilidad para identificar los nuevos temas, tratamos de limitarlos a los nombres de APIs o tecnologías. Algunos ejemplos:</p>
+
+<ul>
+ <li><code>{{Tag("HTML")}}</code></li>
+ <li><code>{{Tag("CSS")}}</code></li>
+ <li><code>{{Tag("JavaScript")}}</code> (cuidado con la "S" mayúscula!)</li>
+ <li><code>{{Tag("Documento")}}</code></li>
+ <li><code>{{Tag("DOM")}}</code></li>
+ <li><code>{{Tag("API")}}</code> para cada interfaz, método y propiedad</li>
+ <li><code>{{Tag("Método")}}</code> para cada método de una API</li>
+ <li><code>{{Tag("Propiedad")}}</code> para cada propiedad de una API</li>
+ <li><code>{{Tag("Gráficos")}}</code></li>
+ <li><code>{{Tag("Firefox OS")}}</code></li>
+ <li><code>{{Tag("Gecko")}}</code></li>
+ <li><code>{{Tag("XUL")}}</code></li>
+ <li><code>{{Tag("XPCOM")}}</code></li>
+ <li><code>{{Tag("SVG")}}</code></li>
+ <li><code>{{Tag("WebGL")}}</code></li>
+ <li><code>{{Tag("Elemento")}}</code></li>
+ <li><code>{{Tag("Nodo")}}</code></li>
+ <li><code>{{Tag("Herramientas")}}</code></li>
+ <li><code>{{Tag("Web")}}</code></li>
+</ul>
+
+<p>En general, la etiqueta de identificación del tema será el nombre de la interfaz con que este relacionada la página (como nodo "<a href="https://developer.mozilla.org/en-US/docs/Web/API/Node" title="/en-US/docs/Web/API/Node">Node"</a>, que tiene muchas páginas para sus diversas propiedades y métodos), o el nombre general de un tipo de tecnología. Puede etiquetar una página sobre WebGL con <code>Graphics</code> y <code>WebGL</code> ó una página sobre {{HTMLElement("canvas")}} con <code>HTML</code>, <code>Element</code>, <code>Canvas</code> y <code>Graphics</code>.</p>
+
+<h3 id="Estado_tecnológico">Estado tecnológico</h3>
+
+<p>Para ayudar al visitante a comprender el estado actual de una tecnología, usamos estas etiquetas en las páginas para describir la situación de las especificaciones de cada tecnología. Esta descripción no es suficientemente detallada como para explicar los aspectos y avances de las especificaciones (para ello existe la Tabla de Especificaciones), pero ayuda al lector a juzgar si es una buena idea usar la tecnología descrita en el artículo.</p>
+
+<p>Aquí tienen los posibles valores de esta etiqueta:</p>
+
+<dl>
+ <dt><code>{{Tag("Not-standard")}}</code></dt>
+ <dd>Indica que la tecnología o API descrita en la página no forma parte de un estándar, pero se considera estable en cualquier aplicación de navegador. Si no utiliza esta etiqueta, sus lectores asumirán que la tecnología es estándar. La tabla de compatibilidad en la página debe aclarar qué navegador o navegadores soportan esta tecnología o API.</dd>
+ <dt><code>&lt;{{Tag("Deprecated")}}</code></dt>
+ <dd>La tecnología o API cubierta en la página se marca como en desuso en las especificaciones y es probable que con el tiempo sea eliminada de navegadores actuales.</dd>
+</dl>
+
+<dl>
+ <dt><code>{{Tag("Obsolete")}}</code></dt>
+ <dd> La tecnología o API ha sido considerada obsoleta y ha sido eliminada (o actualmente se está retirando) de la totalidad de los navegadores actuales.</dd>
+ <dt><code>{{Tag ("Experimental")}}</code></dt>
+ <dd>La tecnología no es estandar y es una tecnología o API experimental que pueden o no llegar a ser parte de un estandar. También está sujeta a cambios en el motor del navegador (normalmente sólo uno) que lo implementa.</dd>
+ <dt><code>{{Tag("Necesita Privilegios")}}</code></dt>
+ <dd>La API requiere acceso privilegiado al dispositivo en el que se ejecuta el código.</dd>
+</dl>
+
+<dl>
+ <dt><code>{{Tag("Solo Certificado")}}</code></dt>
+ <dd>La API sólo funciona con código certificado.</dd>
+</dl>
+
+<p>¡Estas etiquetas no excluyen el uso de la <a href="https://developer.mozilla.org/en-US/docs/Project:Compatibility_tables" title="/en-US/docs/Project:Compatibility_tables">tabla de compatibilidad</a> en su artículo!</p>
+
+<h3 id="Nivel_de_habilidad">Nivel de habilidad</h3>
+
+<dl>
+ <dd>Utilice este tipo de etiquetas solo para guías y tutoriales (es decir, para páginas que ya esten etiquetadas como <code>Guía</code>)  para ayudar a los usuarios a elegir los tutoriales en base a su nivel. Hay tres valores posibles:</dd>
+ <dt><code>{{Tag ("Principiante")}}</code></dt>
+ <dd>Los artículos diseñados para introducir al lector en una tecnología que nunca han usado o sólo tienen una vaga familiaridad.</dd>
+ <dt><code>{{Tag ("Intermedio")}}</code></dt>
+ <dd>Artículos para los usuarios que ya saben trabajar con la tecnología, pero no son expertos.</dd>
+ <dt><code>{{Tag ("Advanced")}}</code></dt>
+ <dd>Artículos sobre como ampliar las capacidades de una tecnología y del lector.</dd>
+</dl>
+
+<h3 id="Metadatos">Metadatos</h3>
+
+<dl>
+ <dd>La comunidad de escritores utiliza estas etiquetas para designar los artículos que requieran algun tipo trabajo específico. He aquí una lista de los que más utilizamos:</dd>
+ <dt><code>{{Tag ("basura")}}</code></dt>
+ <dd>El artículo debe ser eliminado.</dd>
+ <dt><code>{{Tag ("NecesitaContenido")}}</code></dt>
+ <dd>El artículo es un esbozo o carece de información. Esta etiqueta significa que alguien debe revisar el contenido, añadir más detalles y/o terminar de escribir el artículo.</dd>
+ <dt><code>{{Tag ("NecesitaEjemplos")}}</code></dt>
+ <dd>El artículo necesita uno o más ejemplos para ayudar a demostrar la finalidad el artículo. Estos ejemplos deben utilizar el sistema <a href="https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/How_to_help/Code_samples" title="/en-US/docs/Project:MDN/Contributing/How_to_help/Code_samples">live sample system</a>.</dd>
+ <dt><code>{{Tag ("NecesitaEjemplosReales")}}</code></dt>
+ <dd>El artículo tiene uno o más ejemplos que necesitan ser actualizados para usar el sistema <a href="https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/How_to_help/Code_samples" title="/en-US/docs/Project:MDN/Contributing/How_to_help/Code_samples">live sample system</a>.</dd>
+ <dt><code>{{Tag ("NecesitaActualizacion")}}</code></dt>
+ <dd>El contenido no está actualizado y necesita una actualización.</dd>
+ <dt><code>{{Tag ("excluir")}}</code></dt>
+ <dd>El contenido no necesita ser localizado y no aparecerá en las páginas de estados de localización.</dd>
+ <dt><code>{{Tag ("prioridad")}}</code></dt>
+ <dd>El contenido es importante y debe ser marcado como prioritario para traductores de MDN.</dd>
+</dl>
+
+<h3 id="Mapa_de_Alfabetización_Web">Mapa de Alfabetización Web</h3>
+
+<p>El proyecto <a href="https://webmaker.org" rel="external">WebMaker</a>, a través de <a href="https://webmaker.org/literacy" rel="external">Web Literacy Map</a> ha definido las habilidades necesarias para leer, escribir y participar en la Web de forma óptima. Utilizaremos etiquetas de "Web Literacy Map" en MDN para ayudar a nuestros usuarios a encontrar los recursos que mejor se adapten a sus necesidades:</p>
+
+<dl>
+ <dt><code>{{Tag ("Navegacion")}}</code></dt>
+ <dd>Cómo navegar por la Web</dd>
+ <dt><code>{{Tag ("WebMecanicas")}}</code></dt>
+ <dd>Cómo está organizada y cómo funciona la web</dd>
+ <dt><code>{{Tag ("Buscar")}}</code></dt>
+ <dd>Cómo encontrar información, personas y recursos en la Web</dd>
+ <dt><code>{{Tag ("Credibilidad")}}</code></dt>
+ <dd>Cómo evaluar críticamente la información que encuentre en la Web</dd>
+ <dt><code>{{Tag ("Seguridad")}}</code></dt>
+ <dd>Cómo mantener sistemas, identidades y seguridad de los contenidos</dd>
+ <dt><code>{{Tag ("Composición")}}</code></dt>
+ <dd>Cómo crear y organizar contenido para la Web</dd>
+ <dt><code>{{Tag ("remezcla")}}</code></dt>
+ <dd>Cómo modificar recursos Web existentes para crear algo nuevo</dd>
+ <dt><code>{{Tag ("Diseno")}}</code></dt>
+ <dd>Cómo mejorar la estética visual y la experiencia del usuario</dd>
+ <dt><code>{{Tag ("Accesibilidad")}}</code></dt>
+ <dd>Cómo comunicarse de una manera universalmente reconocible a través de los recursos de la Web</dd>
+ <dt><code>{{Tag ("CodigoScript")}}</code></dt>
+ <dd>Cómo codificar y / o crear experiencias interactivas en la Web</dd>
+ <dt><code>{{Tag ("infraestructura")}}</code></dt>
+ <dd>Cómo funcionan los detalles técnicos de la Internet</dd>
+ <dt><code>{{Tag ("Compartir")}}</code></dt>
+ <dd>Cómo crear recursos con otras personas</dd>
+ <dt><code>{{Tag ("Colaborar")}}</code></dt>
+ <dd>Cómo trabajar con otras personas</dd>
+ <dt><code>{{Tag ("Comunidad")}}</code></dt>
+ <dd>Cómo participar en las comunidades Web y entender cómo funcionan</dd>
+ <dt><code>{{Tag ("Privacidad")}}</code></dt>
+ <dd>Cómo examinar las consecuencias de compartir datos en línea</dd>
+ <dt><code>{{Tag ("Abriendo")}}</code></dt>
+ <dd>Cómo ayudar a mantener la Web accesible a todo el mundo</dd>
+</dl>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Para cada página debes asignar distintos tipos de etiquetas, por ejemplo:</p>
+
+<p><strong>Un tutorial sobre WebGL para principiantes:</strong><code> </code><code>WebGL, Gráficos, Guía, Principiante</code></p>
+
+<p><strong>Página de referencia para <code>{{HTMLElement ("Canvas")}}:</code></strong>  <code>Canvas, HTML, elemento, gráficos</code></p>
+
+<p><strong>Una página de inicio de herramientas para desarrolladores de Firefox OS</strong><code>: Herramientas, Firefox OS, Inicio</code></p>
+
+<h2 id="Filtros_de_etiquetas_y_búsqueda">Filtros de etiquetas y búsqueda</h2>
+
+<p>Los filtros de búsqueda no funcionarán adecuadamente a menos que etiquetamos correctamente las páginas MDN. A continuación hay una tabla de filtros de búsqueda y las etiquetas de búsqueda que funcionan para dichos filtros.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si varias etiquetas se muestran bajo "Nombre de etiqueta", significa que una o más de las etiquetas deben estar presentes en el artículo.</p>
+</div>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Grupo</th>
+ <th scope="col">Nombre filtro</th>
+ <th scope="col">Nombre de etiqueta</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <th>Tema</th>
+ <td>Open Web Apps</td>
+ <td>{{Tag("Apps")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>HTML</td>
+ <td>{{Tag("HTML")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>CSS</td>
+ <td>{{Tag("CSS")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>JavaScript</td>
+ <td>{{Tag("JavaScript")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>APIs and DOM</td>
+ <td>{{Tag("API")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Canvas</td>
+ <td>{{Tag("Canvas")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>SVG</td>
+ <td>{{Tag("SVG")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>MathML</td>
+ <td>{{Tag("MathML")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>WebGL</td>
+ <td>{{Tag("WebGL")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>XUL</td>
+ <td>{{Tag("XUL")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Marketplace</td>
+ <td>{{Tag("Marketplace")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Firefox</td>
+ <td>{{Tag("Firefox")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Firefox para Android</td>
+ <td>{{Tag("Firefox Mobile")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Firefox para Desktop</td>
+ <td>{{Tag("Firefox Desktop")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Firefox OS</td>
+ <td>{{Tag("Firefox OS")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Movil</td>
+ <td>{{Tag("Movil")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Web Development</td>
+ <td>{{Tag("Web Development")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Add-ons &amp; Extensions</td>
+ <td>{{Tag("Add-ons ")}}|| {{Tag("Extensions")}} || {{Tag("Plugins")}} || {{Tag("Themes")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Juegos</td>
+ <td>{{Tag("Juegos")}}</td>
+ </tr>
+ <tr>
+ <th>Nivel</th>
+ <td>Soy experto</td>
+ <td>{{Tag("Experto")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Intermedio</td>
+ <td>{{Tag("Intermedio")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Soy aprendiz</td>
+ <td>{{Tag("Aprendiz")}}</td>
+ </tr>
+ <tr>
+ <th>Tipo Documento</th>
+ <td>Docs</td>
+ <td>Restringirá la búsqueda al contenido de los docs, dejando fuera otros contenidos MDN.</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Demostración</td>
+ <td>Incluirá el contenido de demostración en los resultados de búsqueda.</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Herramientas</td>
+ <td>{{Tag("Herramientas")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Ejemplo Código</td>
+ <td>{{Tag("Ejemplo")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Como &amp; Tutorial</td>
+ <td>{{Tag("Guia")}}</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Perfiles Desarrollador</td>
+ <td>Incluirá perfiles de desarrolladores de MDN en los resultados de búsqueda.</td>
+ </tr>
+ <tr>
+ <th> </th>
+ <td>Recurso externo</td>
+ <td>Es algo que el equipo de desarrollo todavía está descifrando...</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Problemas_de_etiquetado_que_puedes_solucionar">Problemas de etiquetado que puedes solucionar</h2>
+
+<p>Hay varios tipos de problemas de etiquetado que puedes ayudar a solucionar:</p>
+
+<dl>
+ <dt>Sin etiquetas</dt>
+ <dd>Generalmente los artículos deben tener por lo menos una etiqueta "categoría" y una etiqueta de "tema". Si puedes ayudar a asegurar que el mínino de etiquetas estén presentes, ¡te convertirás en nuestro héroe de documentación!</dd>
+ <dt>Etiquetas que no siguen nuestras normas de etiquetado</dt>
+ <dd>Por favor, corrija los documentos en los que las etiquetas no siguen las normas de esta página.</dd>
+ <dt>Etiquetas incorrectos</dt>
+ <dd>Si está buscando en un artículo acerca de "HTML" y esta etiquetado como "JavaScript", eso probablemente es incorrecto! Del mismo modo, si un artículo de discusión interna de Mozilla tiene una etiqueta "Web", probablemente sea incorrecto también. Remueva las etiquetas y añada las etiquetas correctas si aun no están. Por favor, corrija también los errores ortográficos (por ejemplo, "Javascript" coincide ya que las etiquetas no son sensibles a las mayúsculas, ¡pero no nos descuidemos!).</dd>
+ <dt>Etiquetas que faltan</dt>
+ <dd>Si un artículo tiene algunas pero no todas las etiquetas que necesita, no dude en añadir más. Por ejemplo, si una página en referencia a JavaScript está (correctamente) etiquetado como "JavaScript" pero nada más, ¡estás invitado a etiquetar la página como "Referencia"!</dd>
+ <dt>Etiqueta Spam</dt>
+ <dd>
+ <p>Es el mayor problema de etiquetado de la Web, la publicidad no deseada. ¡Tenemos que eliminar estas etiquetas de inmediato!, son desagradables y difíciles de manejar si permanecen mucho tiempo en la web. Además, son terribles para {{Glossary("SEO")}}.</p>
+ </dd>
+</dl>
+
+<p>Si ve uno (o más) de estos problemas, por favor acceda a MDN "<a href="https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/Getting_started#Logging_into_MDN">log into MDN</a>" y haz clic en Editar en la parte superior derecha de la ventana de MDN. Una vez que cargue el editor, desplácese hasta la parte inferior de la página, donde puedes encontrar el cuadro de etiquetas. Para más detalles sobre la interfaz de etiquetado, consulte el cuadro de etiquetas "<a href="https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/Editor_guide#The_tags_box" title="/en-US/docs/Project:MDN/Contributing/Editor_guide#The_tags_box">The tags box"</a> en la guía del editor de MDN.</p>
diff --git a/files/es/mdn/contribute/howto/usar_barras_laterales_de_navegación/index.html b/files/es/mdn/contribute/howto/usar_barras_laterales_de_navegación/index.html
new file mode 100644
index 0000000000..4ba8e4e4e4
--- /dev/null
+++ b/files/es/mdn/contribute/howto/usar_barras_laterales_de_navegación/index.html
@@ -0,0 +1,78 @@
+---
+title: Cómo usar las barras laterales de navegación
+slug: MDN/Contribute/Howto/Usar_barras_laterales_de_navegación
+translation_of: MDN/Contribute/Howto/Use_navigation_sidebars
+---
+<p>{{MDNSidebar}}{{Draft}}</p>
+
+<p>La navegación en MDN se realiza frecuentemente usando barras laterales que listan otros artículos en una serie así como contenido relacionado tanto en la misma suite de documentación como en otras áreas de MDN. <span class="seoSummary">Las barras laterales de MDN no se crean automáticamente; para incluirlas en la página, es necesario crear y utilizar una macro de algún tipo. En este artículo, revisaremos el proceso de creación de las macros de MDN en la barra lateral y cómo utilizarlas en un artículo.</span></p>
+
+<h2 id="Macros_actuales_de_las_barras_laterales_de_MDN">Macros actuales de las barras laterales de MDN</h2>
+
+<p>MDN ya tiene varias macros para crear barras laterales. La mayoría son específicas para secciones particulares de MDN, mientras que otras tienen la intención de crear barras laterales genéricas para áreas de documentación que de otra manera no tendrían ninguna.</p>
+
+<dl>
+ <dt>{{TemplateLink("AddonSidebar")}}</dt>
+ <dd>Inserts a sidebar for navigating the add-ons documentation; this is primarily content about creating browser extensions.</dd>
+ <dt>{{TemplateLink("APIRef")}}</dt>
+ <dd>Inserts a sidebar used within API interface reference pages and subpages.</dd>
+ <dt>{{TemplateLink("CanvasSidebar")}}</dt>
+ <dd>Inserts a sidebar used within the HTML/DOM Canvas documentation.</dd>
+ <dt>{{TemplateLink("DefaultAPISidebar")}}</dt>
+ <dd>Inserts a default sidebar that can be used on the API overview page of an API that doesn't have its own sidebar type.</dd>
+ <dt>{{TemplateLink("FirefoxSidebar")}}</dt>
+ <dd>Inserts a sidebar used on the documentation that's specific to Firefox.</dd>
+ <dt>{{TemplateLink("GamesSidebar")}}</dt>
+ <dd>Inserts a sidebar for navigating MDN's content about developing games using web technologies.</dd>
+ <dt>{{TemplateLink("HTMLSidebar")}}</dt>
+ <dd>Inserts the sidebar used within MDN's HTML documentation.</dd>
+ <dt>{{TemplateLink("HTTPSidebar")}}</dt>
+ <dd>Inserts a sidebar for use on pages within MDN's HTTP documentation.</dd>
+ <dt>{{TemplateLink("JSSidebar")}}</dt>
+ <dd>Inserts a sidebar for use within the JavaScript documentation.</dd>
+ <dt>{{TemplateLink("LearnSidebar")}}</dt>
+ <dd>Inserts the Learning Area sidebar.</dd>
+ <dt>{{TemplateLink("MDNSidebar")}}</dt>
+ <dd>Inserts a sidebar for navigating MDN's "meta-documentation;" that is, documentation about using and editing the MDN Web Docs site itself. You can actually see that macro in use on this page.</dd>
+ <dt>{{TemplateLink("ServiceWorkerSidebar")}}</dt>
+ <dd>Inserts a sidebar for use within documentation about Service Workers.</dd>
+ <dt>{{TemplateLink("SpiderMonkeySidebar")}}</dt>
+ <dd>Inserts a sidebar for use on pages documenting SpiderMonkey, Mozilla's JavaScript engine.</dd>
+ <dt>{{TemplateLink("ToolsSidebar")}}</dt>
+ <dd>Inserts a sidebar listing pages about Firefox developer tools.</dd>
+ <dt>{{TemplateLink("WebAssemblySidebar")}}</dt>
+ <dd>Inserts a sidebar containing links related to WebAssembly.</dd>
+ <dt>{{TemplateLink("WebExtAPISidebar")}}</dt>
+ <dd>Inserts a sidebar used to navigate the API reference documentation about browser e3dtensions (WebExtensions).</dd>
+ <dt>{{TemplateLink("WebGLSidebar")}}</dt>
+ <dd>Inserts a sidebar that provides navigation of WebGL-related content.</dd>
+ <dt>{{TemplateLink("WebRTCSidebar")}}</dt>
+ <dd>Inserts a sidebar whose contents provide navigation of WebRTC documentation on MDN.</dd>
+ <dt>{{TemplateLink("XSLTRef")}}</dt>
+ <dd>Inserts a sidebar with documentation for XSLT, EXSLT and XPath.</dd>
+</dl>
+
+<h2 id="Using_sidebars">Using sidebars</h2>
+
+<p>To add a sidebar to a page, find the right macro, then, on the page on to which you want to insert the sidebar, click the "Edit" button. Add to the page a {{HTMLElement("p")}} block whose contents are simply the call to the macro. Once there, you can add the macro call. Typically, sidebar macros don't require any parameters, so you can just do, for example:</p>
+
+<pre class="brush: html; no-line-numbers">&lt;p&gt;\{{MDNSidebar}}&lt;/p&gt;</pre>
+
+<p>Usually, you should do this as the first line of the document. In some documents, it's been done at the bottom instead. This works fine, but for the sake of consistency, try to place it at the top.</p>
+
+<p>If there's already a {{HTMLElement("p")}} block with macro calls at the top of the page, such as those that create banners like <code>\{{Non-standard_Header}}</code>, you can put the sidebar macro inside the same {{HTMLElement("p")}}, like this:</p>
+
+<pre class="brush: html; no-line-numbers">&lt;p&gt;\{{HTTPSidebar}}\{{Non-standard_Header}}&lt;/p&gt;</pre>
+
+<h2 id="Creating_sidebars">Creating sidebars</h2>
+
+<p><em>details coming</em></p>
+
+<p>Talk about {{TemplateLink("SidebarUtilities")}}.</p>
+
+<p>There are some macros that can be used to help build sidebars:</p>
+
+<dl>
+ <dt>{{TemplateLink("ListSubpagesForSidebar")}}</dt>
+ <dd>Creates a tree of links structured for use in a sidebar, using the subpages of the specified page.</dd>
+</dl>
diff --git a/files/es/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html b/files/es/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html
new file mode 100644
index 0000000000..a2ae723fb2
--- /dev/null
+++ b/files/es/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html
@@ -0,0 +1,72 @@
+---
+title: Cómo escribir una nueva entrada en el Glosario
+slug: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary
+tags:
+ - Glosario
+ - Guía
+ - Howto
+ - MDN Meta
+translation_of: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary
+---
+<div>{{MDNSidebar}}</div>
+
+<p>El <a href="/es/docs/Glossary">glosario</a> MDN es el sitio donde definimos toda la terminología, jerga, y abreviaciones usadas en la documentación y en la codificación. Contribuir al glosario es una manera simple de hacer la Web más fácil para que todo el mundo la entienda. No necesitas un nivel alto de conocimientos técnicos para escribir entradas en el glosario, porque éstas deberían ser simples y sencillas.</p>
+
+<p>Este artículo describe como escribir una buena entrada al glosario acerca de un tema para el sitio web de MDN docs.</p>
+
+<h2 id="Comó_escribir_una_entrada">Comó escribir una entrada</h2>
+
+<p>Si estás buscando temas que necesitan una entrada al glosario, revisa la <a href="https://developer.mozilla.org/en-US/docs/Glossary#Contribute_to_the_glossary">lista de temas indocumentados </a>en el final de la página principal del Glosario; sigue cualquiera de esos enlaces para empezar una nueva página al Glosario para el item que has seguido;después digue los pasos más abajo.</p>
+
+<p>Si tienes una idea para una nueva entrada al glosario, simplemente abre el siguiente botón en una nueva pestaña y sigue las instrucciones siguientes al botón:</p>
+
+<p></p><div class="align-center"><a class="button ignore-external mega positive" href="/en-US/docs/new?parent=4391">Escribir una nueva entrada en el Glosario<div></div></a></div><p></p>
+
+<h3 id="Paso_1_Escribir_un_resumen">Paso 1: Escribir un resumen</h3>
+
+<p>El primer párrafo de cualquiera de las páginas del glosario es una descripción simple y corta del término, preferentemente de no más de una o dos oraciones. Asegúrate de que cualquiera que esté leyendo el glosario debe de poder entender la definición del término inmediatamente.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>Por favor no copies y pegues definiciones de cualquier otro sitio (especialmente no de la Wikipedia, ya que su rango de licencias es más pequeño, y lo hace incompatible con MDN). Es realmente importante que el contenido sea simple y fácil de entender. <span lang="es">Merece la pena dedicarle algo de tiempo en lugar de robar contenido a ciegas. Este glosario debería ser contenido nuevo útil, no cosas repetidas de cualquier otro sitio.</span></p>
+</div>
+
+<p>Los enlaces a la entrada del glosario usarán esos resúmenes en sus tooltips, de tal forma que los lectores puedan ver las definiciones sin navegar fuera de la página donde se encuentran. (Ver más abajo como insertar enlaces a entradas del glosario con la macro \{{Glossary}} .)</p>
+
+<p>Si debes, tu puedes añadir algún párrafo extra, pero es muy fácil verte escribiendo un artículo entero. Escribir un artículo completo está bien, pero por favor no lo pongas en el glosario. Si no estás seguro de dónde poner tu artículo, sienteté libre de <a href="https://developer.mozilla.org/en-US/docs/MDN/Community#Join_our_mailing_lists">discutirlo</a>.</p>
+
+<h3 id="Paso_2_Extenderse_con_los_enlaces">Paso 2: Extenderse con los enlaces</h3>
+
+<p>Finalmente, una entrada al glosario debería terminar siempre con una sección "Aprender más" . Esta sección debería contener enlaces para ayudar al lector a prograsar: descubrir nuevos detalles, aprender a usar la tecnología relevante, etc.</p>
+
+<p>Recomendamos que ordenes los enlaces al menos en estos tres grupos:</p>
+
+<p> </p>
+
+<p>Esta sección es donde se puede escribir una descripción más detallada. En esta sección no hay que dudar en explicar todos los detalles necesarios, proveer algún contexto o detalles históricos interesantes, etc. Depende de usted. Lo que hay que recordar es que debe de enfocarse en conocimiento general en lugar de en detalles técnicos. Si desea escribir en detalles técnicos, es mejor escribir un artículo regular en MDN. La intención del glosario es proveer información a la audiencia general, así que un principiante debe de poder comprender esta sección.</p>
+
+<p>As an example, take a look at the "{{Glossary("JavaScript")}}" term definition.</p>
+
+<h3 id="Step_3_Open_up_with_links">Step 3: Open up with links</h3>
+
+<p>Finally, a glossary entry should always end with a "Know more" section. This section should contain links to help the reader move forward: discovering more details, learning to use the relevant technology, and so on.</p>
+
+<p>We recommend that you categorize the links in at least these three categories:</p>
+
+<dl>
+ <dt>General knowledge</dt>
+ <dd>Links that provide more general information; for example, a link to <a href="http://wikipedia.org/">Wikipedia</a> is a good starting point.</dd>
+ <dt>Technical reference</dt>
+ <dd>Links to more in-depth technical information. These links can be to pages on MDN or elsewhere on the Internet.</dd>
+ <dt>Learn about it</dt>
+ <dd>Links to tutorials, exercises, or any other teaching materials that can directly help the reader learn to use the technology behind the term being defined.</dd>
+</dl>
+
+<h2 id="Suggested_terms">Suggested terms</h2>
+
+<p>Do you want to contribute but you don't know which terms need to be defined? Here's a list of suggestions. Click one and get started!</p>
+
+<p>{{GlossaryList({"terms":["ARIA","Array","ATAG","Asynchronous","BiDi","Blink","Block","CalDAV","Call stack","CardDAV","Constant","Constructor","Content type","Closure","CORS","CSRF","Control flow","Character","Crawler","DNS","Doctype","Domain","DTD","Dynamic typing","ECMA","Element","Entity","Exception","Adobe Flash","FTP","Host","HTTP","Hyperlink","Hypertext","I18N","Identifier","IDL","MS Internet Explorer","IETF","IIFE","Immutable","Internationalization","IndexedDB","Instance","Internet","IP address","IPv4","Keyword","Locale","Localization","ltr","MathML","Method","Microsoft Internet Explorer","MIME type","Mobile First","Mozilla Firefox","Netscape Navigator","NAT","Native","Null","OOP","Opera Browser","Operand","Operator","Parameter","Parser","PDF","Presto","property","Protocol","Prototype","Pseudo-class","Pseudo-element","RDF","Recursion","Reflow","Regular expression","Rendering engine","Responsive design","REST","rtl","Scope","CSS Selector","Server","SSL","Stacking context","State machine","Statement","STUN","Synchronous","Tag","TLS","Trident","TURN","Type","Value","Variable","Wrapper"], "filter":"notdefined", "css":"multiColumnList"})}}</p>
+
+<p> </p>
+
+<p> </p>
diff --git a/files/es/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html b/files/es/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html
new file mode 100644
index 0000000000..05d72dd7f7
--- /dev/null
+++ b/files/es/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html
@@ -0,0 +1,106 @@
+---
+title: Cómo escribir un artículo para ayudar a las personas a aprender sobre la Web.
+slug: MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web
+tags:
+ - Aprender
+ - Como
+ - Guía
+ - MDN Meta
+translation_of: MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web
+---
+<div>{{MDNSidebar}}</div>
+
+<p>El área de aprendizaje de MDN es nuestro hogar para artículos que presentan conceptos web a nuevos desarrolladores. Debido a que su contenido está dirigido principalmente a principiantes, es un gran lugar para compartir tus conocimientos y ayudar a los recién llegados a conocer la web. Es importante asegurarse de que los nuevos desarrolladores puedan seguir este contenido, por lo que le prestamos especial atención.</p>
+
+<p>Este artículo explica cómo escribir páginas para el <a href="/en-US/docs/Learn">Área de aprendizaje</a>.</p>
+
+<h2 id="Cómo_escribir_un_artículo_en_el_Área_de_aprendizaje">Cómo escribir un artículo en el Área de aprendizaje</h2>
+
+<p>Para comenzar a aportar tu conocimiento, simplemente haz clic en el botón verde grande, luego sigue los cinco pasos a continuación. Si estás buscando ideas, echa un vistazo al <a href="https://trello.com/b/LDggrYSV">tablero de Trello de nuestro equipo</a>.</p>
+
+<div class="align-center"><a class="button ignore-external mega positive" href="/en-US/docs/new?parent=111819">Escribe un nuevo artículo</a></div>
+
+<p>Este artículo podría no terminar exactamente en el lugar correcto, pero al menos está en MDN. Si necesitas hablar con alguien para que lo trasladen al lugar correcto, por favor <a href="/es/docs/Learn#Contact_us">contáctanos</a>.</p>
+
+<h3 id="Paso_1_Escribe_en_dos_líneas">Paso 1: Escribe en dos líneas</h3>
+
+<p>La primera oración de tu artículo debe resumir qué tema vas a cubrir y la segunda debe entrar en algunos detalles más sobre los elementos que pondrías en el artículo. Por ejemplo:</p>
+
+<div class="summary">
+<p>Mientras {{glossary("HTML")}} los archivos contienen contenido estructurado, {{Glossary("CSS")}}, otra tecnología web, hace que el contenido se vea como tú quieres. En este artículo vamos a cubrir cómo funciona esta tecnología y cómo escribir tu propio ejemplo básico.</p>
+</div>
+
+<p>Observa cómo el ejemplo explica brevemente que CSS es una tecnología web central que se usa para diseñar páginas. Eso es suficiente para que el lector tenga una idea bastante buena de lo que cubre el artículo.</p>
+
+<p>Debido a que los artículos del Área de aprendizaje se dirigen principalmente a los principiantes, cada artículo debe cubrir un tema directo para no abrumar al lector con demasiada información nueva. Si no puedes resumir el artículo en una oración, ¡podrías estar intentando hacer demasiado en un artículo!</p>
+
+<h3 id="Paso_2_Agregar_un_cuadro_superior">Paso 2: Agregar un cuadro superior</h3>
+
+<p>Luego, agrega un cuadro superior para ayudar a los lectores a orientarse sobre dónde se encuentran en el proceso de aprendizaje. Aquí hay un ejemplo de un cuadro superior de <a href="/en-US/docs/Learn/Understanding_URLs">"Entendiendo las URLs y su estructura"</a>. Puedes usar este artículo como modelo cuando escribas tu propio artículo.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+ <tr>
+ <th scope="row">Requisitos previos:</th>
+ <td>Primero necesitas saber<a class="new" href="/es/docs/Learn/How_the_Internet_works"> cómo funciona Internet</a>, <a class="new" href="/es/docs/Learn/What_is_a_Web_server">qué es un servidor web</a>  y <a class="new" href="/es/docs/Learn/Understanding_links_on_the_web">los conceptos detras de los enlaces de la web</a>.</td>
+ </tr>
+ <tr>
+ <th scope="row">Objetivo:</th>
+ <td>Aprenderás qué es una URL y cómo funciona en la web.</td>
+ </tr>
+ </tbody>
+</table>
+
+<dl>
+ <dt>Requisitos previos</dt>
+ <dd>¿Qué debe saber ya el lector para seguir el artículo? Cuando sea posible, haz de cada requisito previo un enlace a otro artículo del Área de aprendizaje que cubra el concepto (a menos que sea un artículo realmente básico que no requiere conocimiento previo).</dd>
+ <dt>Objetivos</dt>
+ <dd>Esta sección explica brevemente lo que el lector aprenderá a lo largo del artículo. Esto es un poco diferente al de una sola línea; (el one-liner resume el tema del artículo), mientras que la sección de objetivos establece específicamente lo que el lector puede esperar lograr en el transcurso del artículo.</dd>
+</dl>
+
+<div class="note">
+<p><strong>Nota:</strong> Para crear esta tabla, puedes copiar y pegar la tabla del ejemplo anterior o usar la herramienta de tabla del editor de MDN. Si eliges usar la herramienta de tabla, tienes que agregar específicamente la clase CSS <code>learn-box</code> además de la clase predeterminada <code>standard-table</code>.Para hacer esto, cuando crees o edites las propiedades de la tabla, ve al panel "Avanzado" y configura el campo <strong>Stylesheet Classes</strong> a "<code>standard-table learn-box</code>".</p>
+</div>
+
+<h3 id="Paso_3_Escribir_una_descripción_completa">Paso 3: Escribir una descripción completa</h3>
+
+<p>A continuación, escribe una descripción más larga que ofrezca una visión más completa del artículo, destacando los conceptos más importantes. ¡No olvides explicar por qué el lector debe tomarse el tiempo para aprender este tema y leer tu artículo!</p>
+
+<h3 id="Paso_4_Cavar_más_profundo">Paso 4: Cavar más profundo</h3>
+
+<p>Cuando hayas terminado con todo eso, finalmente puedes sumergirte profundamente en el tema. Puedes estructurar esta parte de tu artículo como desees (aunque no dudes en consultar nuestra <a href="/en-US/docs/MDN/Contribute/Style_guide">guía de estilo</a>). ¡Esta es tu oportunidad para brillar! Entra en detalles explicando el tema sobre el que estás escribiendo. Proporciona enlaces a la documentación de referencia completa, explica cómo funciona la tecnología en detalle, brinda detalles de sintaxis y uso, etc. ¡Tú decides!</p>
+
+<p>Como guía, aquí hay algunos consejos de escritura para principiantes:</p>
+
+<ul>
+ <li>Centrarse en un solo tema. Si sientes que necesitas cubrir otros temas, significa que te estás perdiendo un artículo de requisito previo o debes dividir tu artículo en más de uno.</li>
+ <li>Usa un español simple. Evita los términos técnicos cuando puedas o al menos defínelos y haz un enlace a sus entradas del <a href="/es/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary#How_to_use_the_.7B.7BGlossary.7D.7D_macro">glosario</a> cuando corresponda.</li>
+ <li>Incluye ejemplos sencillos para que los conceptos teóricos sean más fáciles de entender. Muchas personas aprenden mejor con el ejemplo. En lugar de escribir artículos académicos, queremos que los principiantes sigan el texto fácilmente.</li>
+ <li>Las ayudas visuales a menudo pueden hacer que las cosas sean más fáciles de digerir y transportar información adicional, así que siéntase libre de usar imágenes, diagramas, videos y tablas. Si está utilizando diagramas o cuadros que incluyen texto, le recomendamos que utilice {{Glossary("SVG")}} para que nuestros equipos de traducción puedan localizar el texto.</li>
+</ul>
+
+<p>Eche un vistazo a las primeras secciones de nuestras <a href="/es/docs/Learn/JavaScript/Building_blocks/Functions">Funciones - Bloques de código reutilizables</a> para algunas buenas secciones descriptivas.</p>
+
+<h3 id="Paso_5_Proporcionar_material_de_aprendizaje_activo">Paso 5: Proporcionar material de "aprendizaje activo"</h3>
+
+<p>Para ilustrar el artículo y ayudar al lector a comprender mejor lo que están aprendiendo, asegúrese de proporcionar ejercicios, tutoriales y tareas que cumplir. Al hacer que utilicen y experimenten de forma activa y práctica con los conceptos que explica su artículo, puede ayudar a "bloquear" la información en sus cerebros.</p>
+
+<p>Puede elegir incluir los ejemplos directamente en la página como <a href="/en-US/docs/MDN/Contribute/Structures/Live_samples">muestras en vivo</a>, o <a href="/en-US/docs/MDN/Contribute/Editor/Links">vincularlos</a> si realmente no funcionan como una muestra en vivo. Si está interesado en ayudar a crear estos valiosos materiales, lea el artículo <a href="/es/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">Cree un ejercicio interactivo para ayudar a aprender la web</a>.</p>
+
+<p>Si no puede proporcionar enlaces a materiales de aprendizaje activos existentes (no sabe de ninguno o no tiene tiempo para crearlos), debe agregar la etiqueta{{Tag("NeedsActiveLearning")}}  al artículo. De esa manera, otros colaboradores pueden encontrar artículos que necesitan materiales de aprendizaje activo y quizás ayudarlo a encontrarlos.</p>
+
+<p>Eche un vistazo a <a href="/en-US/docs/Learn/CSS/Introduction_to_CSS/Simple_selectors#Active_learning_Selecting_different_elements">Aprendizaje activo</a>: seleccione diferentes elementos para un ejercicio de aprendizaje interactivo en vivo, o <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions#Active_learning_Playing_with_scope">Aprendizaje activo juegue</a> con posibilidades para un estilo diferente de ejercicio que les exija descargar una plantilla localmente y modificarla siguiendo los pasos proporcionados.</p>
+
+<h3 id="Paso_6_Obtenga_el_artículo_revisado_y_póngalo_en_el_menú_de_navegación_del_Área_de_aprendizaje">Paso 6: Obtenga el artículo revisado y póngalo en el menú de navegación del Área de aprendizaje</h3>
+
+<p>Después de que hayas escrito tu artículo, avísanos para que podamos echarle un vistazo, hacer una revisión y sugerir mejoras. Una vez más, consulte nuestra sección <a href="/en-US/docs/Learn#Contact_us">Contáctenos</a> para conocer las mejores maneras de comunicarse.</p>
+
+<p>En el menú de navegación principal del Área de aprendizaje. Este menú es generado por la <a href="/en-US/docs/Template:LearnSidebar">macro Barra de aprendizaje</a>, que necesita privilegios especiales para editar, así como una vez más, hable con uno de nuestro equipo sobre cómo agregarlo.</p>
+
+<p>Al menos debe agregarlo a su página. Esto se hace agregando la llamada a la macro \{{LearnSidebar}} en un párrafo en la parte superior de su página.</p>
+
+<h2 id="Artículos_sugeridos">Artículos sugeridos</h2>
+
+<p>¿Así es que quieres contribuir?</p>
+
+<p>El equipo del Área de Aprendizaje Mantiene ONU Tablero de <a href="https://trello.com/b/LDggrYSV">Trello</a> las ideas Con de Artículos para Escribir. ¡Siéntete libre de elegir uno y ponte a trabajar!</p>